Webpack 2没有以正确的顺序编译文件

当我运行webpack时，我的javascript资源没有按照正确的顺序编译。正确的顺序应该是Webpack 2没有以正确的顺序编译文件

jQuery的
引导

然而，遵守包文件包含自举第一则jQuery的。请参考下面

webpack.config

var path = require('path'); 
var webpack = require('webpack'); 
var extractTextPlugin = require('extract-text-webpack-plugin'); 
var cleanWebpackPlugin = require('clean-webpack-plugin'); 

var jsDestPath = './wwwroot/'; 

const config = { 
    entry: { 
    css: './Assets/scss/app.scss', 
    app: './Assets/js/app.js', 
    vendor: './Assets/js/vendor.js' 
}, 
output: { 
    path: path.resolve(__dirname, 'wwwroot/js'), 
    filename: '[chunkhash].[name].js' 
}, 
module: { 
    rules: [ 
     { 
      test: /\.js$/, 
      use: 'babel-loader' 
     }, 
     { 
      test: /\.scss$/, 
      loader: extractTextPlugin.extract({ 
       loader: 'css-loader!sass-loader' 
      }) 
     } 
    ] 
}, 
plugins: [ 
    new webpack.optimize.CommonsChunkPlugin({ 
     names: ['vendor', 'manifest'] //Specify the common bundle's name. 
    }), 

    new extractTextPlugin({ filename: 'bundle.css', disable: false, allChunks: true}), 

    new webpack.LoaderOptionsPlugin({ 
     debug: true, 
     minimize: true, 
    }), 

    new webpack.optimize.UglifyJsPlugin({ 
     compress: { 
      warnings: true, 
     } 
    }), 

    new cleanWebpackPlugin(['js'], { 
     root: jsDestPath, 
     verbose: true, 
     dry: false 
    })  
], 
} 

module.exports = config;

vendor.js

import 'jquery/dist/jquery.js'; 
import 'bootstrap/dist/js/bootstrap.js';

来源

2017-01-03 Erkan Demir

中的模块存在于的WebPack输出的顺序并不一定意味着是订单在其中加载它们。在代码中需要/导入之前，webpack不会加载（执行）jQuery模块。实际上，你会看到执行顺序仍然是正确的。

来源

2017-01-03 14:37:22 Ambroos

感谢您的评论。但是，当页面加载时，我得到的错误控制台中没有定义jQuery。 Bootstrap依赖于Jquery。 –

@ErkanDemir，你有没有得到答案呢？ – icfantv

您可能需要设置

global.jQuery = require('jquery');

在使用引导js文件。我在使用另一个js库时遇到了这个问题，这个js库依赖于jQuery，我通过npm安装了它，并将其安装到了我的js文件中，但是它没有找到jQuery。

原因是很多使用jQuery的js图书馆已经移植到npm，似乎没有使用require（）ing jQuery的CommonJS方法，他们只是在全局命名空间中寻找jQuery定义。

来源

2017-02-16 14:14:55

Webpack 2没有以正确的顺序编译文件

回答

相关问题