运行在webpack开发服务器上,使用一个基于函数的字符串替换插件进行替换。我发现替换的值覆盖了我的源文件。
我的Dev服务器配置如下:
const devServer = (options) => {
return {
devServer: {
hot: true,
inline: true,
stats: 'errors-only',
host: options.host,
port: options.port,
historyApiFallback: true
},
plugins: [
new webpack.HotModuleReplacementPlugin({
multiStep: true
})
]
}
}
字符串替换插件配置为:
const constants = (data) => {
return {
module: {
loaders: [
{
test: /.jsx?$/,
loader: StringReplacePlugin.replace({
replacements:[
{
pattern:/`CONSTANT_(.*)`/g,
replacement:(match,p1,offset,string)=>{
console.log('MATCH '+p1)
const keys = p1.split('.')
let current = data
keys.forEach((key)=>{
current = current[key]
})
console.log('Replacing '+p1+' with '+current)
return `'${current}'`
}
}
]
})
}
]
},
plugins: [
new StringReplacePlugin()
]
}
}
输入/输出值为:
const base = {
entry: {
app: path.resolve(PATHS.app, './index.jsx')
},
output: {
path: PATHS.build,
filename: 'app.js',
publicPath: '/'
},
resolve: {
extensions: ['', '.js', '.jsx', '.json']
}
}
是否有任何原因webpack开发服务器将更改源文件?
编辑:1添加JS部分:
const js = (paths) => {
const cacheDir = (process.env.CACHE_DIRECTORY ? process.env.CACHE_DIRECTORY : 'true')
return {
module: {
loaders: [
{
test: /.jsx?$/,
exclude: /(node_modules|bower_components)/,
loaders: [
`babel?cacheDirectory=${cacheDir}`, // presets on .babelrc
'eslint-loader?fix'
],
include: paths
}
]
}
}
}
编辑2原因似乎是eslint加载器?修复,当移除适当的行为时实现。现在我正在寻找如何防止
把eslint-loader?