时间戳

首页 > 解决方案 > 如果 index.html 不加载任何 javascript，Vue 应用程序如何启动？

javascript - 如果 index.html 不加载任何 javascript，Vue 应用程序如何启动？

问题描述

我读过的关于 Vue 的资源都没有试图解释 Vue 应用程序是如何启动的。涉及三个文件：public/index.html、src/main.js 和 src/App.vue。使用 vue cli 4.1.1 创建的脚手架包含这个 index.html，它显然是入口点：

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width,initial-scale=1.0">
    <link rel="icon" href="<%= BASE_URL %>favicon.ico">
    <title>sample-vue-project</title>
  </head>
  <body>
    <noscript>
      <strong>We're sorry but sample-vue-project doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
    </noscript>
    <div id="app"></div>
    <!-- built files will be auto injected -->
  </body>
</html>

main.js 文件创建了 Vue 应用程序本身，但 index.html 不加载 main.js。如果我双击 index.html 我会得到一个空白页面，因此必须进行其他干预才能启动该应用程序。index.html 中的注释说文件将被自动注入，但注入是什么？

Vue 启动过程是否记录在某处？

标签： javascriptvuejs2

解决方案

当您在本地开发时，Vue Cli 会处理注入，因为您的运行命令将类似于npm run serve默认配置。

当您开始将代码投入生产时，您最终将运行一个不同的命令npm run build，该命令将创建一组新文件，其中 index.html 文件将包含一个引用所有 JavaScript 代码的脚本标记。在底层它使用 webpack 来完成所有的资产链接。

有关更多详细信息，请参阅Vue Cli网站。

推荐阅读