Question

我希望能够在我的webpack.config中使用es6导入和导出默认值。如果我像这样运行我的webpack。

webpack.config.js

"webpack": "cross-env NODE_ENV=development webpack-dev-server --config webpack.config.js"

我收到错误SyntaxError: Unexpected token import预计会发生错误。然后我找到了其他问题解决方案，似乎对很多人有用。将文件重命名为webpack.config.babel.js并包括babel-register。我试过了的 webpack.config.babel.js

"webpack": "cross-env NODE_ENV=development node -r babel-register node_modules/.bin/webpack-dev-server --config=webpack.config.babel.js"

但现在我收到此错误

basedir=$(dirname "$(echo "$0" | sed -e 's,\\,/,g')")
          ^^^^^^^
SyntaxError: missing ) after argument list

我尝试了很多与babel-node和babel-register的组合，但似乎没有任何效果。我在Windows 10上。我该怎么做？

Answer 1

尝试直接运行webpack，而不使用babel-register：

"webpack": "cross-env NODE_ENV=development node_modules/.bin/webpack-dev-server --config=webpack.config.babel.js"

另外，请确保.babelrc文件中包含babel-plugin-transform-es2015-modules-commonjs插件，或者如果您使用es2015预设，则modules选项为设为true。如果您不希望Babel在其他情况下（例如制作生产包时）转换模块，您可以告诉babel-loader不要使用.babelrc并手动指定预设：

{
  test: /\.js$/,
  exclude: /node_modules/,
  loader: 'babel-loader',
  options: {
    babelrc: false,
    presets: [
      ['latest', {
        modules: false,
      }],
    ],
  },
},

在webpack.config

1 个答案: