我们在webpack中使用style-loader
,在编译时,它似乎会在源代码中放置有关当前目录的信息,这些信息会在加载/卸载模块时注入样式标记。看起来大致如下:
if(false) {
// When the styles change, update the <style> tags
if(!content.locals) {
module.hot.accept("!!./../../../../../node_modules/css-loader/index.js!./../../../../../node_modules/sass-loader/index.js?includePaths[]=/var/deploy/referrals/web_head/releases/20151118202441/node_modules/patternity/node_modules/node-neat/node_modules/node-bourbon/node_modules/bourbon/app/assets/stylesheets&includePaths[]=/var/deploy/referrals/web_head/releases/20151118202441/node_modules/patternity/node_modules/node-neat/node_modules/bourbon-neat/app/assets/stylesheets&includePaths[]=/var/deploy/referrals/web_head/releases/20151118202441/node_modules/patternity&includePaths[]=/var/deploy/referrals/web_head/releases/20151118202441/node_modules/infl-fonts!./campaigns.scss", function() {
var newContent = require("!!./../../../../../node_modules/css-loader/index.js!./../../../../../node_modules/sass-loader/index.js?includePaths[]=/var/deploy/referrals/web_head/releases/20151118202441/node_modules/patternity/node_modules/node-neat/node_modules/node-bourbon/node_modules/bourbon/app/assets/stylesheets&includePaths[]=/var/deploy/referrals/web_head/releases/20151118202441/node_modules/patternity/node_modules/node-neat/node_modules/bourbon-neat/app/assets/stylesheets&includePaths[]=/var/deploy/referrals/web_head/releases/20151118202441/node_modules/patternity&includePaths[]=/var/deploy/referrals/web_head/releases/20151118202441/node_modules/infl-fonts!./campaigns.scss");
if(typeof newContent === 'string') newContent = [[module.id, newContent, '']];
update(newContent);
});
}
// When the module is disposed, remove the <style> tags
module.hot.dispose(function() { update(); });
}
需要注意的是accept
字符串中列出的目录。
现在,一旦uglify运行(因为if (false)
),这个代码最终会被删除。然而我的问题在于,这个编译发生在2台机器上,并且块散列似乎在 uglification之前发生,因为哈希在2台不同的机器上生成(甚至在同一台机器上但在不同的机器上生成文件夹)是不同的。如果我要部署到生产机器并且需要这两台机器来提供具有相同摘要的资产,这显然是行不通的。
只是为了澄清,当没有缩小时,代码是不同的,因此生成不同的散列,但缩小确实实际上使文件相同,但是块缩放似乎在缩小之前发生。
在运行uglify插件后,有谁知道如何让生成chunkhash。我正在使用这样的配置:
...
output: {
filename: '[name]-[chunkhash].js'
...
使用命令:
webpack -p
修改
所以看完这个。我现在看到这与我们将includePaths
添加到我们的样式加载器有关,它看起来像这样:
var includePaths = require('node-neat').includePaths;
module: {
loaders: [
{ test: /\.scss$/, loader: "style!css!sass?includePaths[]=" + includePaths },
]
}
所以我认为我们知道为什么我们正在获取这些绝对网址,但我认为最初的问题仍然存在,IMO webpack应该在缩小之后散列块,而不是之前。