时间戳

首页 > 解决方案 > 错误：不变量失败：哈希历史需要一个 DOM

javascript - 错误：不变量失败：哈希历史需要一个 DOM

问题描述

首先，为我糟糕的英语道歉，希望你能理解......

错误显示在这里：

ERROR in   Error: webpack-internal:///./node_modules/tiny-invariant/dist/tiny-invariant.esm.js:14
    throw new Error(prefix + ": " + (message || ''));
    ^
  Error: Invariant failed: Hash history needs a DOM

  - tiny-invariant.esm.js:14 invariant
    [.]/[tiny-invariant]/dist/tiny-invariant.esm.js:14:9

  - history.js:577 createHashHistory
    [.]/[history]/cjs/history.js:577:16

  - index.js:36 _default
    [.]/[dva]/lib/index.js:36:64

  - index.js:32 eval
    webpack-internal:///./src/index.js:32:53

  - index.html:7396 Module../src/index.js
    /Users/mac/Desktop/workspace/test/reproduce/code-reproduce/src/index.html:7396:1

  - index.html:21 __webpack_require__
    /Users/mac/Desktop/workspace/test/reproduce/code-reproduce/src/index.html:21:30

  - index.html:3 eval
    [.]/[html-webpack-plugin]/lib/loader.js!./src/index.html:3:34

  - index.html:5904 Object../node_modules/html-webpack-plugin/lib/loader.js!./src/index.html
    /Users/mac/Desktop/workspace/test/reproduce/code-reproduce/src/index.html:5904:1

  - index.html:21 __webpack_require__
    /Users/mac/Desktop/workspace/test/reproduce/code-reproduce/src/index.html:21:30

  - index.html:85
    /Users/mac/Desktop/workspace/test/reproduce/code-reproduce/src/index.html:85:18

理论上，项目在我的本地服务器上运行，它应该有 dom。

这是我的最小可重现存储库地址：

https://github.com/shauvet/code-reproduce/tree/dva-admin

脚步：

第 1 步：纱线 第 2 步：纱线开始

import './index.html'
import 'babel-polyfill'
import dva from 'dva'
import createLoading from 'dva-loading'
import { hashHistory } from 'dva/router'
import appMod from './models'
import router from './router'

// 1. Initialize
const app = dva()

app.use(createLoading())

// 2. Model
// app.model(require('./models/app'))
app.model(appMod)
// 3. Router
// app.router(require('./router'))
app.router(router)

// 4. Start
app.start('#root')

环境信息：

节点版本：12.16.2 操作系统版本：osx 10.15.4

标签： javascriptreactjswebpackreact-router

解决方案

最后，我在webpackHtmlPlugin中添加了：</p> 

new HtmlWebpackPlugin({
      // filename: 'index.html',
      template: 'src/index.html',
      inject: 'body'  // here
})

并且错误消失了。

推荐阅读