一、对js处理
webpack本身支持js加载也可以用插件。
1、加载要全局使用的插件比如jquery
在页面用cdn方式引用,然后再webpack.config.js里配置。会让jquery成为全局的插件,不用每个js去require。
externals : {'jquery' : 'window.jQuery'}
2、提出公共的js模块打包到base.js。在配置文件plugins配置,这里需要webpack=require(webpack)。
先在entry里配置
'common' : ['./src/page/common/index.js']
然后再plugins里配置
new webpack.optimize.CommonsChunkPlugin({
name : 'common',
filename : 'js/base.js'
})
二、对css样式处理
使用css-loader和style-loader
在module配置:
loaders: [
{ test: /\.css$/, loader: "style-loader","css-loader" }
]
但是这样是打包到js文件里。想单独打包到css需要安装
extract-text-webpack-plugin
然后再先require
var ExtractTextPlugin = require('extract-text-webpack-plugin');
接着在plugins里配置
new ExtractTextPlugin("css/[name].css")
最后在loader改为
{ test: /\.css$/, loader: ExtractTextPlugin.extract("style-loader","css-loader") },