webpack-dev-server& jsxhint:const' $ __ 0'已经宣布

时间:2015-06-11 11:53:35

标签: npm reactjs webpack webpack-dev-server

不知何故,当我运行以下命令时,似乎jsxhint正在通过webpack分析编译的文件

 webpack-dev-server --devtool eval --colors --progress --content-base ./build

我收到这些警告

const '$__0' has already been declared. @ line <n> char <m>

应用程序中约30%的文件。

当我进入Sources Tab > webpack:// > . > relative-path-to-file时,它引用了与我的chrome devtools中可用的(处理过的)文件相对应的行号和字符号。我试图找到这些文件在磁盘上的位置,以将它们添加到预加载器的排除列表中,但根据webpack-dev-server documentation这些文件是从内存中提供的。

我已经尝试完全删除应用程序和所有节点模块并从存储库中再次检出它,但这并没有解决问题。

删除node_modules文件夹后,在更新package.json文件中的节点模块后问题就出现了。我已经尝试回滚到所有节点模块的先前版本,但问题仍然存在。

webpack.config.js的内容

...

preLoaders: [
      {
        test: /\.jsx?$/,
        loader: 'jsxhint-loader?harmony',
        exclude: /node_modules/
      }
    ],
loaders: [
  {
    test: /\.jsx?$/,
    loader: "react-hot!babel",
    exclude: /node_modules/
  },

的package.json

...

"devDependencies": {
  "autoprefixer-core": "^5.2.0",
  "babel-core": "^5.5.6",
  "babel-jest": "^5.2.0",
  "babel-loader": "^5.1.4",
  "css-loader": "^0.14.5",
  "file-loader": "^0.8.4",
  "html-webpack-plugin": "^1.5.0",
  "jest-cli": "^0.4.11",
  "json-loader": "^0.5.2",
  "jsx-loader": "^0.13.2",
  "jsxhint-loader": "^0.2.0",
  "less": "^2.5.1",
  "less-loader": "^2.2.0",
  "node-libs-browser": "^0.5.2",
  "postcss-loader": "^0.4.4",
  "react-hot-loader": "^1.2.7",
  "react-immutable-proptypes": "^1.0.0",
  "react-tools": "^0.13.3",
  "style-loader": "^0.12.3",
  "url-loader": "^0.5.6",
  "webpack": "^1.9.10",
  "webpack-dev-server": "^1.9.0"
},

1 个答案:

答案 0 :(得分:0)

删除?harmony预加载器参数似乎已解决此问题。此参数内部发送到reactToolsjsx-loader在源代码到达react-tools@0.12.2之前对其进行了转换。似乎这两个版本的模块不兼容(jsxhint-loader@0.2.0var {foo} = this.props)以这种方式使用。

这已将$__0 = this.props; var foo = $__0.foo;等语句更改为转换为var _props = this.props; var foo = _props.foo;而转换为harmony。我还没有发现任何命名冲突,就像删除<script> function myFunction() { document.getElementById("myDIV").style.display = "block"; document.getElementById("second").style.display = "none"; } </script> <script> function myFunction2() { document.getElementById("second").style.display = "block"; document.getElementById("myDIV").style.display = "none"; } </script> 参数之前发生的命名冲突一样。