Question

我正在尝试实现我的js项目的长期缓存。我一直在使用survivaljs（http://survivejs.com/webpack_react/developing_with_webpack/）页面作为教程。

我发现.css和.js都使用相同的哈希：

app.860846ea86c7b67eddd0.js       132 kB       0  [emitted]  app
styles.860846ea86c7b67eddd0.css   21 bytes       0  [emitted]  app

当我刚刚更改.css文件时，两个文件都会更新（我希望.js文件保持不变？）。

app.353477b32cc15ea06465.js     132 kB       0  [emitted]  app
styles.353477b32cc15ea06465.css   20 bytes       0  [emitted]  app

我已经验证了不应该更改的文件具有相同的md5总和。

最终我想要的是，如果我改变样式，生成的css散列会改变，js散列将保持不变（反之亦然）。即js内容没有改变，它被缓存在浏览器中，所以为什么强行重新下载。

我已经创建了一个示例github repo来演示。（自述文件还有一些细节）。

https://github.com/vlod/webpack_chunk_strange/tree/master

我很感激一些帮助。我对webpack相当新，而且很可能是配置错误，但我花了两天时间尝试了所有的事情。

感谢。

Answer 1

原始配置的问题是JS / CSS属于同一块。因此，如果CSS改变了，那么块也是如此 - ＆gt; JS / CSS都失效了。基于这种实现，我最终将CSS分离为自己的一大块。这可以通过设置自己的入口点来实现：

entry: {
  ...
  style: [
    'purecss',
    'highlight.js/styles/github.css',
    'react-ghfork/gh-fork-ribbon.ie.css',
    'react-ghfork/gh-fork-ribbon.css',
    './demo/main.css',
    './style.css'
  ]
}

此entry会提取您需要的所有CSS。有一些警告：

除了CSS，这将生成一个JS文件。如果您最有可能通过ExtractTextPlugin从中提取CSS，那么该文件不会做太多事情，但它仍然存在。
这种方法不会扩展到更复杂的场景。如果您需要从JS代码中引用CSS，则会再次遇到原始问题。

有关完整配置，请参阅我的boilerplate。

对于css和js文件，Webpack散列相同。只有一个人应该改变

1 个答案: