如何使用 Laravel Mix 将版本号添加到路径中？

Question

我正在使用 Laravel Mix 编译我的 JS 和 CSS 资产。我目前正在使用.version()来实现这一点。

问题是这会产生一个类似于以下内容的文件：

/css/app.css?id=03def6a69840076e8f29

这在本地提供服务时工作正常，但如果我使用 CDN 通过原始拉取提供此内容，则查询字符串不会强制重新拉取文件。理想情况下，我想要以下内容：

/css/03def6a69840076e8f29/app.css

或者：

/css/03def6a69840076e8f29.css

这两个是不同的文件，因此它强制拉动 CDN。

Laravel Mix 如何实现这一点？

Answer 1

我遇到了同样的问题，并提出了解决方案：

1. 将以下行添加到public/.htaccess：

   RewriteRule ^assets/[a-f0-9]+/(.*)$ /$1 [L]

就在之前RewriteCond %{REQUEST_FILENAME} !-d

这会将网址/assets/ab7320d/css/whatever.css视为/css/whatever.css

2. 将以下代码放入resources/assets/js/rewriteMixManifest.js

   let fs = require('fs')
   let mixManifestPath = `${process.cwd()}/public/mix-manifest.json`
   let mixFileContents = fs.readFileSync(mixManifestPath)
   let oldMapping = JSON.parse(mixFileContents)
   function updateMapping(path) {
       if(path.indexOf("?") < 1) {
           return path
       }
       let [filename, idPart] = path.split("?")
       let [_, id] = idPart.split("=")
       return `/assets/${id}${filename}`
   }
   let newContent = {}
   for(let file in oldMapping) {
       newContent[file] = updateMapping(oldMapping[file])
   }
   console.log("Manifest rewritten.")
   fs.writeFileSync(mixManifestPath, JSON.stringify(newContent, null, 2))
   

3. 在 中package.json，添加以下行scripts（就像“dev”键一样）

   "rewrite-manifest": "node resources/assets/js/rewriteMixManifest.js",
   

4. 每次构建后（例如npm run production）也运行npm run rewrite-manifest

所以public/mix-manifest.jsonfile 的作用是将每个资源文件 (for ) 映射{{ mix('css/app.css') }}到某个实际上会转为 HTML 的字符串。我的脚本重写了字符串，以将版本放入路径中，而不是查询字符串中。.htaccess确保路径被正确解释。

路径结构当然可以由您根据自己的喜好进行更改

对我来说它解决了 Google Cloud CDN 的问题，希望它也能帮助你