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

标签 javascript vuejs2

我读过的关于 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 中的注释说文件将被自动注入(inject),但注入(inject)是什么?

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

最佳答案

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

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

Vue Cli网站了解更多详情。

关于javascript - 如果 index.html 不加载任何 javascript,Vue 应用程序如何启动?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/59632463/

相关文章:

javascript - 为什么 Javascript 的 Date.getDate() .setDate() 行为如此不可预测?

javascript - 使用 React 动态绘制线条的更好方法

php - MySQL模式,哪种方式性能更高? M-N 关系还是将所有相关 ID 保存为字符串?

javascript - 在 Vue 中向用户列表添加功能复选框

javascript - 使用 V-For 为按钮动态分配键码

javascript 将选项元素添加到选择列表,但具有自定义数据属性

javascript - 如何从 cordova 插件将对象注入(inject) ionic Controller ?

javascript - 如何在 cordova 移动设备上本地加载 base64 音频?

javascript - Vue.js : Set an HTML attribute inside v-for based on array data

javascript - 如何向 taginput 元素添加验证?