不能在 webpack 配置中使用 ES6 导入

Question

CommonJS 导入const webpack = require('webpack');工作正常，但 ES6import webpack from 'webpack';没有。

来自Webpack 文档：

webpack 版本 2 原生支持 ES6 模块语法。

但它对我来说不是开箱即用的。

我也试过：

• 使用babel-loader的JS文件;
• 将“babel”添加到配置文件名称中。

但这一切都行不通。

包.json

"scripts": {
    "build:dev": "webpack --config webpack.config.dev.babel"
},
"devDependencies": {
    "babel-loader": "^7.1.4",
    "webpack": "^4.8.3",
    "webpack-cli": "^2.1.3",
    "webpack-merge": "^4.1.2"
}

webpack.config.common.babel.js

export const /* in this implied like default */ module = {
    loaders: [
        {
            test: /\.js$/,
            loader: 'babel-loader',
            exclude: '/node_modules/'
        }
    ],
};

webpack.config.dev.babel.js

import webpack from 'webpack';
import merge from 'webpack-merge';
import commonConfig from './webpack.config.common.babel';

export default merge(commonConfig, {
    mode: 'development',
    plugins: [
        new webpack.DefinePlugin({
            'process.env.NODE_ENV': JSON.stringify('development')
        })
    ]
});

.babelrc

{
    "presets": ["es2015"]
}

当我输入时，npm run build:dev它会抛出：

import webpack from 'webpack';
^^^^^^

SyntaxError: Unexpected token import

问题：

1. 如何使 ES6 导入工作？
2. 可以开箱即用，即没有任何babel-loader包装？

Answer 1

好吧，我注意到的第一件事是你不能在 webpack 文件中使用“import”。你需要“要求”：

  const webpack = require('webpack');

你不能使用 import，因为那是 ES6，如果你还没有安装 babel，你如何使用 ES6？没有任何 JS 引擎（据我所知）原生支持 ES6，更不用说 Node.js 了。

另外，我认为您会收到 ES2015 的警告 - 我认为现在应该是“babel-preset-env”。