您的位置:首页 > Web前端 > Webpack

webpack配置

2015-09-18 21:49 531 查看
var webpack = require('webpack');
var path = require("path");
module.exports = {
// context: __dirname + "/src",//The base directory (absolute path!)
// 表示入口文件
cache: true,
entry: {
'bundle': './src',
// 'app2': '/src/app2'
},
minimize: true,
// 表示输出文件
output: {
path: path.join(__dirname, "build"),// 编译好的文件目录
filename: '[name].min.js',
chunkFilename: "[chunkhash].min.js"
// sourceMapFilename: '[file].map'
// publicPath: "/build/" // 引用你的文件时考虑使用的地址
},
// 表示这个依赖项是外部lib,遇到require它不需要编译,
// 且在浏览器端对应window.React
externals: [
{
'react': 'window.React',
'react-bootstrap': 'window.ReactBootstrap',
'jquery': 'window.jQuery'
}
],

module: {
loaders: [
// 凡是遇到jsx结尾的,都用jsx-loader这个插件来加载,
// 且启用harmony模式
//{ test: path.join(__dirname, 'es6'), loader: 'babel-loader' },'jsx-loader?harmony'
{ test: /\.js$/, loader: 'babel-loader!jsx-loader?harmony' },
{ test: /\.jsx$/, loader: "jsx-loader?insertPragma=React.DOM" },
{ test: /\.less$/, loader: 'style-loader!css-loader!less-loader' }, // use ! to chain loaders
{ test: /\.css$/, loader: 'style-loader!css-loader' },
{ test: /\.(png|jpg)$/, loader: 'url-loader?limit=8192' }, // 内联 base64 URLs, 限定 <=8k 的图片, 其他的用 URL

// required for bootstrap icons
{ test: /\.woff$/, loader: "url-loader?prefix=font/&limit=5000&mimetype=application/font-woff" },
{ test: /\.ttf$/, loader: "file-loader?prefix=font/" },
{ test: /\.eot$/, loader: "file-loader?prefix=font/" },
{ test: /\.svg$/, loader: "file-loader?prefix=font/" }

]
},
resolve: {
// 现在可以写 require('file') 代替 require('file.coffee')
extensions: ['', '.webpack.js', '.coffee', '.json', '.js', '.jsx'],
modulesDirectories: [
'node_modules',
'bower_components',
'lib',
'src'
]
// alias: {
//     // Bind version of jquery
//     jquery: "jquery-2.0.3",

//     // Bind version of jquery-ui
//     "jquery-ui": "jquery-ui-1.10.3",

//     // jquery-ui doesn't contain a index file
//     // bind module to the complete module
//     "jquery-ui-1.10.3$": "jquery-ui-1.10.3/ui/jquery-ui.js",
// }
},
devtool: 'source-map',
plugins: [
new webpack.DefinePlugin({// definePlugin 接收字符串插入到代码当中, 所以你需要的话可以写上 JS 的字符串
__DEV__: JSON.stringify(JSON.parse(process.env.BUILD_DEV || 'true')),
__PRERELEASE__: JSON.stringify(JSON.parse(process.env.BUILD_PRERELEASE || 'false'))
}),
new webpack.optimize.UglifyJsPlugin(),
new webpack.optimize.CommonsChunkPlugin('common.min.js', 5),
new webpack.ProvidePlugin({
// Automtically detect jQuery and $ as free var in modules
// and inject the jquery library
// This is required by many jquery plugins
$: "jquery",
jQuery: "jquery",
"window.jQuery": "jquery"
})
]
};
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: