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

柔情只为你懂 2024-04-17 16:43 39阅读 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 条评论，39人围观）

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

相关阅读

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

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

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

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

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

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

相关 ruby hash添加数据_如何在Ruby中向Hash添加元素？

ruby hash添加数据 Before going through the ways to add elements to the hash instances, let

朴灿烈づ我的快乐病毒、/ 2023年03月05日 13:24/ 0 赞/ 21 阅读

相关 Jenkins+svn+tomcat自动打包并部署到远程服务器

本文主要介绍了使用Jenkins自动打包到远程服务器。一、Jenkins简介 Jenkins是一个开源软件项目，是基于Java开发的广泛用于持续构建的可视化web工具

r囧r小猫/ 2023年02月26日 07:27/ 0 赞/ 36 阅读

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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