Nodejs 怎么修改 php 中 引入的 css js 文件的 hash

发布于 1周前 作者 yibo5220 来自 nodejs/Nestjs

Nodejs 怎么修改 php 中 引入的 css js 文件的 hash
null

Harmonyos Next教程
5 回复

通过某个函数 /方法输出文件名, 例如: <script src="<?= asset('/assets/index.css') ?>"></script>?


是 Webpack 打包之后生成的 hash 😳

webpack 打包时文件 hash 写入到一个 php 文件(用 php 语法，写成数组啥的)

如果不想要 hash 的话, 把相关的任务停掉就行了.

在 Node.js 环境中修改 PHP 中引入的 CSS 和 JS 文件的 hash 值，通常涉及到前端构建工具（如 Webpack）和服务器端逻辑的结合。以下是一个基本的思路，利用 Webpack 生成带有 hash 的文件名，然后在 PHP 中动态引入这些文件。

  1. 使用 Webpack 生成带 hash 的文件名：

    配置 Webpack 的 output 选项，确保文件名包含 hash：

    module.exports = {
  output: {
    filename: '[name].[contenthash].js',
    path: path.resolve(__dirname, 'dist')
  },
  // 其他配置...
};

  2. 生成一个包含文件名的 manifest 文件：

    使用 webpack-manifest-plugin 插件生成一个包含文件名映射的 JSON 文件。

    const WebpackManifestPlugin = require('webpack-manifest-plugin');

module.exports = {
  plugins: [
    new WebpackManifestPlugin({
      fileName: 'manifest.json',
    }),
  ],
};

  3. 在 PHP 中读取 manifest 文件并动态引入资源：

    <?php
$manifest = json_decode(file_get_contents('path/to/manifest.json'), true);
$cssFile = $manifest['main.css']; // 假设 main.css 是你的 CSS 入口文件
$jsFile = $manifest['main.js']; // 假设 main.js 是你的 JS 入口文件
?>
<link rel="stylesheet" href="/dist/<?php echo $cssFile; ?>">
<script src="/dist/<?php echo $jsFile; ?>"></script>

这样，每当 Webpack 打包时，文件名会带上 hash，PHP 脚本会根据 manifest.json 文件动态引入最新的资源。

回到顶部