How to merge all js files into one? With minify in webpack 1.* ?
Here is my part of webpack config
entry: {
bundle: "./src/index.tsx",
styles: './static/scss/main.scss',
main : [
'./static/js/jquery.js',
'./static/js/bowser.js',
'./static/js/bootstrap.js',
'./static/js/jquery.resizeend.js',
'./static/js/slick.js',
'./static/js/jquery.waypoints.js',
'./static/js/jquery.backgroundpos.js',
'./static/js/jquery.fancybox.js',
'./static/js/select2.full.js',
'./static/js/jquery.mousewheel.js',
'./static/js/clipboard.js',
'./static/js/circle-progress.js',
'./static/js/common.js',
'./static/js/main.js'
]
},
output: {
filename: "[name].js",
path: "../root/js/react",
library: '[name]'
},
after build all js files are minified but i have problems with these dependencies :
bootstrap can't find jquery
Uncaught Error: Bootstrap's JavaScript requires jQuery
at Object.1213 (main.js:3)
at t (main.js:1)
at Object.0 (main.js:1)
at t (main.js:1)
at main.0 (main.js:1)
at main.js:1
Note: Jquery comes before bootstrap so it should be ok
Jquery comes before bootstrap so it should be ok
No that is not the case, because webpack still keeps them as modules, but bootstrap expects jQuery to be present globally. You can fix this by using the ProvidePlugin, so webpack automatically imports jQuery whenever it sees it being used. Add it to your plugins
section in your webpack config:
plugins: [
new webpack.ProvidePlugin({
$: 'jquery',
jQuery: 'jquery'
})
]
Note: I linked the docs for webpack 2, but this works the exact same for webpack 1.