Question

我从使用egghead.io tutorial的React和Flux架构开始，但我遇到了一些与babel有关的麻烦。

我在尝试使用webpack-dev-server运行我的应用程序时遇到错误。这是错误：

ERROR in The node API for `babel` has been moved to `babel-core`.
 @ (webpack)-dev-server/client?http://localhost:3002 1:10-24

ERROR in The node API for `babel` has been moved to `babel-core`.
 @ (webpack)-dev-server/client?http://localhost:3002 3:16-37

ERROR in The node API for `babel` has been moved to `babel-core`.
 @ (webpack)-dev-server/client?http://localhost:3002 2:13-37

ERROR in (webpack)/~/process/browser.js
Module build failed: Error: Couldn't find preset "es2015" relative to directory "/usr/local/lib/node_modules/webpack/node_modules/process"
    at /var/www/public/flux/node_modules/babel-core/lib/transformation/file/options/option-manager.js:372:17
    at Array.map (native)
    at OptionManager.resolvePresets (/var/www/public/flux/node_modules/babel-core/lib/transformation/file/options/option-manager.js:364:20)
    at OptionManager.mergePresets (/var/www/public/flux/node_modules/babel-core/lib/transformation/file/options/option-manager.js:348:10)
    at OptionManager.mergeOptions (/var/www/public/flux/node_modules/babel-core/lib/transformation/file/options/option-manager.js:307:14)
    at OptionManager.init (/var/www/public/flux/node_modules/babel-core/lib/transformation/file/options/option-manager.js:465:10)
    at File.initOptions (/var/www/public/flux/node_modules/babel-core/lib/transformation/file/index.js:194:75)
    at new File (/var/www/public/flux/node_modules/babel-core/lib/transformation/file/index.js:123:22)
    at Pipeline.transform (/var/www/public/flux/node_modules/babel-core/lib/transformation/pipeline.js:45:16)
    at transpile (/var/www/public/flux/node_modules/babel-loader/index.js:14:22)
 @ ./~/react/lib/ReactDOM.js 1:0-78

另外，这是我的webpack配置文件：

module.exports = {
    entry: "./src/js/main.js",
    output: {
        path: "./dist",
        filename: "bundle.js",
        publicPath: "/"
    },
    devServer: {
        inline: true,
        port: 3002,
        contentBase: "./dist"
    },
    module: {
        loaders: [
            {
                test: /\.jsx?$/,
                exlude: /(node_modules|bower_components)/,
                loader: "babel",
                query: {
                    presets: ["es2015", "react"]
                }
            }
        ]
    }
};

我的package.json文件包含所有依赖项：

 {
  "name": "flux-jenezis",
  "version": "1.0.0",
  "description": "Flux realisatoin usign egghead guide",
  "main": "index.js",
  "scripts": {
    "start": "webpack-dev-server"
  },
  "keywords": [
    "flux",
    "react"
  ],
  "author": "jenezis",
  "license": "ISC",
  "dependencies": {    
    "flux": "^2.1.1",
    "react": "^15.0.2",
    "react-dom": "^15.0.2",
    "react-router": "^2.4.0"
  },
  "devDependencies": {
    "babel-core": "^6.7.7",
    "babel-loader": "^6.2.4",
    "babel-preset-es2015": "^6.6.0",
    "babel-preset-react": "^6.5.0"
  }
}

Doyes anyoyne看到或者解决了这个问题？

PS： 节点版本：5.0.0，NPM版本：3.7.5

UPD：由于Windows共享文件夹，所有使用npm --no-bin-links标志安装的软件包和依赖项...

Answer 1

exlude: /(node_modules|bower_components)/,

应该是

exclude: /(node_modules|bower_components)/,

Answer 2

＆＃34; es2015＆＃34;在：

    .pipe(babel({
        presets: ['es2015']
    }))

实际上是一个路径 - 所以如果你没有在/ usr / local / lib / node_modules / webpack / node_modules / process / es2015目录中预设es2015，你必须指向它，例如：

.pipe(babel({
    presets: ['../../gulp/node_modules/babel-preset-es2015']
}))

它对我有用

Answer 3

运行npm uninstall babel -g

babel软件包已被弃用，不再需要。

Answer 4

你必须安装babel-core。这是必需的依赖

npm i babel-core -D

无法找到相对于目录的预设“es2015”

4 个答案: