webpack 2无法省略'-loader'错误

时间:2017-05-31 04:45:27

标签: reactjs webpack

到目前为止,我一直在我的React项目上成功使用webpack 1.x.我现在正在尝试迁移到webpack 2并遇到这个问题:

在我的actions.js文件中,我从其他文件导入JavaScript函数 - 见下文: enter image description here

当我运行webpack时,我收到以下错误。看起来webpack使我的import语句与导入加载器混淆 - 见下文: enter image description here

这是我刚刚转换为webpack 2格式的webpack.config.js文件:

var IS_DEV = false;
var webpack = require('webpack');
var path = require("path");

var _pluginsDev = [
    new webpack.ProvidePlugin({
        'fetch': 'imports?this=>global!exports?global.fetch!whatwg-fetch',
        moment: 'moment',
        ps: 'perfect-scrollbar'
    }),

];
var _pluginsProd = [
    new webpack.ProvidePlugin({
        'fetch': 'imports?this=>global!exports?global.fetch!whatwg-fetch',
        moment: 'moment',
        ps: 'perfect-scrollbar'
    }),
    new webpack.DefinePlugin({ // Minimizer, removing multiple occurances of imports et.c
        'process.env': {
            'NODE_ENV': JSON.stringify('production')
        }
    }),
    new webpack.optimize.UglifyJsPlugin({
        minimize: true,
        compress: true,
        output: { comments: false }
    })
];

var _devtool = IS_DEV ? 'eval' : 'cheap-module-source-map';
var _plugins = IS_DEV ? _pluginsDev : _pluginsProd;
var _fileName = IS_DEV ? "./build/[name]-bundle.js" : "./dist/[name]-bundle.js";

var _bundles = {
    accounts: './UI/components/accounts/accounts.jsx'
};

module.exports = {
    entry: _bundles,
    output: {
        path: path.resolve(__dirname, "wwwroot"),
        publicPath: "/",
        filename: _fileName
    },
    devtool: _devtool,
    plugins: _plugins,
    module: {
        rules: [
            {
                test: /\.jsx?$/,
                exclude: /(node_modules|bower_components)/,
                loader: "babel-loader",
                options: {
                    presets: ['es2015', 'stage-0', 'stage-2', 'react']
                }
            }
        ]
    },
    resolve: {
        extensions: ['.js', '.jsx']
    }
}

知道造成这种情况的原因以及如何解决这个问题?

1 个答案:

答案 0 :(得分:0)

在新的webpack版本中,您不能省略loader前缀。

new webpack.ProvidePlugin({
        'fetch': 'imports-loader?this=>global!exports?global.fetch!whatwg-fetch',
        moment: 'moment',
        ps: 'perfect-scrollbar'
    })