在我收集的项目中,我有一个main.js
文件,该文件在网站上共享,这就是为什么他们在其中包含了外部依赖关系bootstrap.js
。
main.js
window.jQuery = window.$ = require('jquery');
$(document).ready(function () {
require('./components/menu')();
//other components
});
require('./thirdparty/bootstrap');
require('./components/spinner');
./第三方/自举
// import '../../../../../../../node_modules/bootstrap/js/src/alert';
// import '../../../../../../../node_modules/bootstrap/js/src/button';
import '../../../../../../../node_modules/bootstrap/js/src/carousel';
import '../../../../../../../node_modules/bootstrap/js/src/collapse';
// import '../../../../../../../node_modules/bootstrap/js/src/dropdown';
import '../../../../../../../node_modules/bootstrap/js/src/modal';
// import '../../../../../../../node_modules/bootstrap/js/src/popover';
import '../../../../../../../node_modules/bootstrap/js/src/scrollspy';
import '../../../../../../../node_modules/bootstrap/js/src/tab';
// import '../../../../../../../node_modules/bootstrap/js/src/tooltip';
我正在尝试使用此项目设置webpack&想要将此供应商依赖性,即引导程序移动到单独的块中,因为它不会经常更改。 所以,我添加了一个新的供应商'如下所示
module.exports = [{
name: 'js',
entry: {
main : './src/main.js',
vendor : ['jquery', 'bootstrap']
//other entries
},
output: {
path: './dist',
filename: '[name].js'
},
module: {
loaders: [ /*loaders like babel */ ]
},
plugins: [
new webpack.optimize.CommonsChunkPlugin({
name: 'vendor',
minChunks: Infinity,
filename: '[name].[chunkhash].js'
}),
]
}];
当我运行webpack构建时,构建生成良好&我的项目有效,但我有两个不同的块复制的引导程序,即main.js
& vendor.js
。
我认为通过在供应商中声明bootstrap
,webpack选择了bootstrap node_modules并将其包含在vendor.js中。
现在,我所需的webpack输出只是将 ./ thirdparty / bootstrap js文件中的引导组件移动到供应商块。
有可能吗?
答案 0 :(得分:0)
我通过在供应商中指定我想要的确切依赖项来解决它。
['jquery', './node_modules/bootstrap/js/src/carousel.js',
'./node_modules/bootstrap/js/src/collapse.js', './node_modules/bootstrap/js/src/modal.js',
'./node_modules/bootstrap/js/src/scrollspy.js', './node_modules/bootstrap/js/src/tab.js'
];
在指定了确切的bootstrap js后,我需要解决我的双重问题。