dva中打包时使用hash文件名并自动添加到index.html

柔情只为你懂 2024-04-17 16:43 32阅读 0赞

# **问题描述：** #

如果不用 hash文件名，而是固定文件名，可能导致前段缓存这个 js文件，导致需要经常清理缓存。通过动态的hash文件名可以解决这个问题。打包后webpack会自动注入带hash的文件地址到 index.ejs文件中。

# 1、在 .webpackrc 文件中添加 #

{
      "hash": true, // 文件名使用hash的方式进行打包
      "html": {
        "template": "./public/index.ejs"
      },
    }

# 2、删除 public 下的 index.html 文件，新增 index.ejs 文件 #

文件内容如下

<!DOCTYPE html>
    <html lang="en">
    <head>
      <meta charset="UTF-8">
      <meta name="viewport" content="width=device-width, initial-scale=1">
      <title>Dva Demo</title>
    </head>
    <body>
    
      <div id="root"></div>
    
    </body>
    </html>

# 3、遇到的问题 #

## 问题1 ##

启动可能报错，这是因为.webpackrc 文件配置还是有点问题，具体没有找原因，加上一部分配置就可以了，如下

{
      "hash": true, // 文件名使用hash的方式进行打包
      "html": {
        "template": "./public/index.ejs"
      },
      "extraBabelPlugins": [
        ["import", {
          "libraryName": "antd",
          "libraryDirectory": "es",
          "style": true
        }]
      ]
    }

## 问题2 ##

需要安装 babel-plugin-import ，这个组件是按需加载组件。

发表评论取消回复

表情：

评论列表（有 0 条评论，32人围观）

还没有评论，来说两句吧...

相关阅读

相关 vue webpack打包后静态资源文件名hash值去除

载地址：[https://blog.csdn.net/qq\_36497461/article/details/89852181][https_blog.csdn.net...

怼烎@/ 2024年04月19日 10:38/ 0 赞/ 58 阅读

相关 dva中打包时使用hash文件名并自动添加到index.html

**问题描述：** 如果不用 hash文件名，而是固定文件名，可能导致前段缓存这个 js文件，导致需要经常清理缓存。通过动态的hash文件名可以解决这个问题。打...

柔情只为你懂/ 2024年04月17日 16:43/ 0 赞/ 33 阅读

相关 Maven中添加本地包并且打包到jar

1. 由于最近使用到了sqljdbc4这个依赖包，但是收到限制，并不能从仓库中下载这个包，所以需要[手动下载][Link 1]好这个jar然后在pom.xml中引入本地的jar

太过爱你忘了你带给我的痛/ 2023年02月17日 02:20/ 0 赞/ 37 阅读

相关 git add 添加文件时文件名不能有空格

背景把其他文件直接复制到我的项目下，然后没注意文件名有空格，就导致无法通过add 命令添加到本地仓库。文件名末尾有空格 ![在这里插入图片描述][202107

素颜马尾好姑娘i/ 2023年01月23日 09:58/ 0 赞/ 345 阅读

相关 PyCharm自动添加作者、时间、文件名注释

路径：File→Settings→Editor→File and Code Templates→Python Script，apply。添加一下内容： -- c

港控/mmm°/ 2023年01月13日 04:13/ 0 赞/ 221 阅读

相关 js 添加元素时自动滚动到最下面

KaTeX parse error: Expected '\}', got 'EOF' at end of input: …ate(\{scrollTop:(’.ChatcCo

水深无声/ 2022年11月01日 13:43/ 0 赞/ 140 阅读

相关 Hbuilder【打包时未添加vedioplayer模块】

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ub

ゞ浴缸里的玫瑰/ 2022年09月13日 15:27/ 0 赞/ 197 阅读

相关 iOS离线打包 Xcode打包时未添加***模块

转载：[iOS离线打包 Xcode打包时未添加\\\模块][iOS_ Xcode] iOS Xcode 提示 HTML5+Runtime 打包时未添加\\\\模块问题亲测

冷不防/ 2022年09月13日 06:28/ 0 赞/ 383 阅读

相关 MySQL设置自动备份【文件名添加系统时间】

自动备份需要先写一个脚本，里边写上我们备份数据库的命令，然后用crontab，让它定时执行就行了。下边是我写的脚本： !/bin/bash /usr

港控/mmm°/ 2022年05月17日 13:06/ 0 赞/ 258 阅读

相关 vue 用webpack打包文件名添加版本号/vue 打包之后的文件如何部署到express服务器上

vue 用webpack打包文件名添加版本号: 因浏览器缓存原因导致vue 打包的文件导致偶尔会出现不能即使更新最新代码。因此在打包的文件名中添加一个版本号以便浏览器能

叁歲伎倆/ 2022年01月27日 11:23/ 0 赞/ 323 阅读