Bra*_*don 5 webpack webpack-dev-server
我有一些要在开发模式下使用的模拟数据文件,但不包括在我的捆绑软件中。
我的项目结构是:
/src/
index.html
Router.jsx
/components
/mockdata <- I don't need this guy in my bundle.js
Run Code Online (Sandbox Code Playgroud)
是否可以将/mockdata目录从我的捆绑软件中排除,但仍通过webpack-dev-server提供文件?我没有在webpack文档的输出部分看到任何内容,但希望有一个解决方法。
/mockdata目录中的文件通过ajax加载。我的webpack配置分为两部分:
发展历程
// webpack.config.js
/*eslint-env node*/
var path = require('path');
var webpack = require('webpack');
module.exports = {
devServer: {
historyApiFallback: true,
port: 3000
},
entry: './src/Router.jsx',
output: {
filename: 'bundle.js',
path: path.join(__dirname, 'dist')
},
plugins: [
new webpack.ProvidePlugin({
React: "react"
})
],
module: {
loaders: [
{
test: /\.(css|less)$/,
loader : 'style!css!less'
},
{
test: /\.(js|jsx|es6)$/,
exclude: /node_modules/,
loader: 'babel'
},
{
test: /\.html$/,
loader: 'file?name=[name].[ext]'
}
]
},
resolve: {
root: path.resolve(path.join(__dirname, 'src')),
modulesDirectories: [
'node_modules'
],
extensions: ['', '.js', '.jsx', '.es6']
}
};
Run Code Online (Sandbox Code Playgroud)
和生产:
// webpack.prod.config.js
var config = require('./webpack.config.js');
var webpack = require('webpack');
var CopyWebpackPlugin = require('copy-webpack-plugin');
config.plugins.push(
new webpack.DefinePlugin({
"process.env": {
"NODE_ENV": JSON.stringify("production")
}
})
);
config.plugins.push(
new webpack.optimize.DedupePlugin()
);
config.plugins.push(
new webpack.optimize.OccurenceOrderPlugin()
);
config.plugins.push(
new webpack.optimize.MinChunkSizePlugin({
minChunkSize: 51200, // ~50kb
})
);
config.plugins.push(
new webpack.optimize.UglifyJsPlugin({
mangle: true,
compress: {
warnings: false
},
output: {
comments: false
}
})
);
config.plugins.push(
new CopyWebpackPlugin([
{
from: 'src/static',
to: 'static'
},
{
from: 'src/index.html'
}
])
);
module.exports = config;
Run Code Online (Sandbox Code Playgroud)
| 归档时间: |
|
| 查看次数: |
1746 次 |
| 最近记录: |