HTMLHTML可以从以下几个方面来理解：索引文件public/index.html文件是一个模板，将使用htmlwebpack插件进行处理。在构建过程中，资产链接将被自动注入，除此之外，VueCLI可以自动注入资源提示（预加载/预取）、清单/图标链接（使用PWA插件时）以及资产链接到构建期间生成的JavaScript和CSS文件。插值由于索引文件被用作模板，因此可以使用lodash模板语法将值插入其中：<%=VALUE%>用于非缩放插值；<%-VALUE%>用于HTML转义插值；<%expression%>用于在JavaScript中控制流。除了htmlwebpack插件暴露的默认值外，所有客户端环境变量也可以直接使用。favicon.ico">Preload是一个资源提示，指定页面加载后不久将需要的资源，所以如果我们希望在页面加载生命周期的早期开始预加载，在浏览器的主要渲染机制启动之前。默认情况下，VueCLI应用程序将自动为应用程序初始呈现所需的所有文件生成预加载提示。提示是使用@vue/preloadwebpack插件注入的，并且可以通过chainWebpack作为config.plugin('preload')修改/删除。预取是一种资源提示，告诉浏览器在页面加载完成后，在浏览器空闲时间内预取用户最近可能访问的内容。默认情况下，VueCLI应用程序将自动为所有为异步块生成的JavaScript文件生成预取提示（这是通过动态import()进行按需代码拆分的结果）。使用@vue/preloadwebpack插件注入提示，也可以通过chainWebpack作为config.plugin('prefetch')修改/删除。注意：当使用多页面设置时，上面的插件名称应该更改为匹配结构“prefetch-{pagename}”，例如“预取应用程序”。在禁用预取插件的情况下，您可以使用webpack的嵌入式注释手动选择特定块进行预取：import(/*webpackPrefetch:true*/'./someAsyncComponent.vue')当加载父块时，webpack的运行时将注入预取链接。禁用索引的生成在现有后端使用VUECLI时，可能需要禁用index.html的生成，以便生成的资产可以在服务器渲染页面中使用，因此我们可以将以下内容添加到vue.config.js:但是上面的代码存在一些问题：硬编码的文件名使得更难以实现高效的缓存控制；硬编码的文件名不能很好地处理代码拆分，因为代码拆分会为文件名生成不同的AdditionalJavaScript文件；硬编码文件名在现代模式下不起作用。相反，我们应该考虑使用indexPath选项将生成的HTML用作服务器端框架中的视图模板。静态资产静态资产可以从以下几个方面来理解：静态资产可以通过两种不同的方式处理：在JavaScript中导入或通过相对路径在模板/CSS中引用。此类引用将由webpack处理。公开放置并通过绝对路径引用。这些资源只会被复制，不会通过webpack相对路径导入。当在.JavaScript、CSS或*.vue文件中使用相对路径（必须以开头）引用静态资源时，该资源将包含在webpack的依赖图中。在此编译期间，所有资产URL，例如、background:url(...)和CSS@import，都被解析为模块依赖项。//将被编译为h('img',{attrs:{src:require('./image.png')}})在内部我们使用file-加载器通过versionhash和正确的publicbasepath确定最终文件位置，使用url-loader条件内联小于4kb的资源，从而减少HTTP请求次数；我们还可以通过chainWebpack调整内联文件大小限制。URL转换规则如果URL是绝对路径（例如：/images/jtzc_1.png），它将保持原样；如果URL以.开头，将被解释为相对模块请求，并根据文件系统结构上的文件夹进行转换；如果URL以~开头，它会被解释为模块请求后的任何内容，这意味着我们甚至可以引用节点模块中的资源；(eg:)如果URL以@开头，它也被解释为一个模块请求。public文件夹放置在public文件夹中的任何静态资产都将被复制，并且不会通过webpack传递。我们需要使用绝对路径来引用它们。注意：只要有可能，我们就将资产作为模块依赖关系图的一部分导入，以便它们通过webpack进行传递，并具有以下好处：脚本和样式表被缩小并捆绑在一起，以避免额外的网络请求；丢失文件导致编译错误，而不是用户的404错误；生成的文件名包含内容哈希，所以我们不需要担心浏览器缓存它的旧版本。公共目录作为转义填充提供。当通过绝对路径引用它时，我们需要考虑我们自己的应用程序将部署在哪里。如果应用没有部署在域的根目录，我们需要在URL前加上publicPath前缀：在public/index.html或者其他被htmlwebpack插件用作模板的html文件中，<%=BASE_URL%>需要加上前缀tolinks:favicon.ico">在模板中，您需要先将基本URL传递给组件数据(){return{publicPath:process.env.BASE_URL}}然后：如何使用公用文件夹：在构建输出中需要具有特定名称的文件；数千张图片，我们需要动态引用它们的路径；有些库可能与Webpack不兼容，当没有其他选择时，它只能作为
