将 webpack 与 babel 和 babel-preset-react 和 babel-preset-es2015 一起使用答案

【问题标题】：Using webpack with babel and babel-preset-react and babel-preset-es2015将 webpack 与 babel 和 babel-preset-react 和 babel-preset-es2015 一起使用
【发布时间】：2016-02-04 02:13:15
【问题描述】：

我正在尝试转编译我的 react/es6 代码，并且来自 browserify。由于新的 babel 6 版本以及大多数教程现在已经过时的事实，我正在努力创建 webpack 构建。这适用于我的 .babelrc：

{
  "presets": ["react"]
}

但是当我把它改成这样的时候：

{
  "presets": ["es2015", "react"]
}

它会抛出这个神秘的错误： ERROR in ./client/App.js Module build failed: Error: You gave us a visitor for the node type "NumericLiteral" but it's not a valid type

如果有帮助的话，这是我的 webpack.config.js：

module.exports = {
  entry: "./client/App.js",
  output: {
    filename: "public/bundle.js"
  },
  resolve: {
    extensions: ['', '.js', '.jsx']
  },
  module: {
    loaders: [
      {
        test: /\.jsx?$/,
        exclude: /(node_modules|bower_components)/,
        loader: 'babel'
      }
   ]
  }
};

我有什么明显的遗漏吗？我还交换了预设的顺序，似乎没有什么区别。我的节点模块中有 babel-core、babel-loader、babel-preset-es2015、babel-preset-react 和 webpack。

【问题讨论】：

你看过github repo的troubleshoot section吗？

标签： javascript reactjs webpack babeljs

【解决方案1】：

我有同样的问题。原来我正在向已经存在的“Object”类添加一个原型方法。

【讨论】：

【解决方案2】：

我用 nvm 解决了这个问题，即使我用 npm 重新安装了几次都没用。我将节点版本更改为 5+，然后它会顺利进行，尽管我已经在 5+ 节点环境中。那是想象。

【讨论】：

【解决方案3】：

我遇到了同样的问题，在我删除 node_modules 目录并重新安装所有依赖项后，它似乎已经消失了。

【讨论】：

哇，这对我真的有用。是某种 npm 安装错误还是其他什么？我以前从未遇到过这个问题。
老实说，我不知道，但我记得不久前偶然发现了另一个 babel 错误并删除了 node_modules 并重新安装了所有修复它的东西。所以好像和babel有点关系。
我重新安装babel-cli (npm -g uninstall babel-cli && npm -g install babel-cli) 后工作正常

【解决方案4】：

如果我是你，我会从这里开始。这将为您提供一个非常小的 React 模板，您可以在其中进行逆向工程并开始学习如何在 webpack 构建中使用 React。 React Boilerplate 这对于快速轻松地入门非常有用，同时学习 webpack 以了解如何使用它。我一直发现 webpack 文档很难找出我需要的东西。我希望这会有所帮助。

【讨论】：