【发布时间】:2016-09-19 13:09:11
【问题描述】:
我是 webpack 的新手。对于我的项目,我有一个 config.js 文件。这个文件基本上就像你在 .net 中的 web.config。只是一个简单的配置文件,它设置了一些特定于环境的设置。我希望能够在部署时为每个环境添加一个新的配置文件。我遇到的问题是我并不总是知道配置设置会在两周后说什么,因此在实际的 webpack 配置中设置配置设置不是一个选项。
我将 config.js 添加到 webpack 配置中,并将哈希和映射添加到配置文件中。这使得很难轻松地放入单独的配置文件。我们希望能够捆绑项目并将工件部署到不同的环境,而无需重新编译和捆绑
有没有办法只包含一个配置文件而无需散列、捆绑和映射?非常感谢任何帮助!
这是我当前的配置文件:
var webpack = require('webpack');
var HtmlWebpackPlugin = require('html-webpack-plugin');
var ExtractTextPlugin = require('extract-text-webpack-plugin');
var helpers = require('./helpers');
module.exports = {
entry: {
'polyfills': './src/polyfills.ts',
'vendor': './src/vendor.ts',
'app': './src/main.ts',
'config': './config/config.js'
},
resolve: {
extensions: ['', '.js', '.ts']
},
module: {
loaders: [
{
test: /\.ts$/,
loaders: ['awesome-typescript-loader', 'angular2-template-loader']
},
{
test: /\.html$/,
loader: 'html'
},
{
test: /\.(png|jpe?g|gif|svg|woff|woff2|ttf|eot|ico)$/,
loader: 'file?name=assets/[name].[hash].[ext]'
},
{
test: /\.css$/,
exclude: helpers.root('src', 'app'),
loader: ExtractTextPlugin.extract('style', 'css?sourceMap')
},
{
test: /\.css$/,
include: helpers.root('src', 'app'),
loader: 'raw'
}
]
},
plugins: [
new webpack.optimize.CommonsChunkPlugin({
name: ['app', 'vendor', 'polyfills']
}),
new HtmlWebpackPlugin({
template: 'src/index.html'
}),
]
};
【问题讨论】:
-
我可能错过了您的问题的重点,但 webpack 配置文件只是 javascript。您可以阅读环境变量之类的内容,这些内容对特定于 env 的运行时很有用。还只是为了澄清您传统上不在产品服务器上运行 webpack,您在本地运行然后将构建的资产上传到 cdn
-
嗨,安迪,我面临的是在构建资产后添加配置。我知道您可以在 webpack 中添加特定于环境的变量。但是,如果您在构建之前不知道确切的环境变量怎么办。因此,我们将拥有需要部署的工件,然后有人添加具有不同参数的附加环境。我们不想重新编译。为了澄清设置将是相同的,只是每个环境的值不同。你遇到过这样的事情吗?
-
构建应该是不可变的并经过测试。如果您必须重新编译以添加环境,则工件可能会有所不同,并且必须针对已设置的每个环境进行重新测试。