首頁 > 文章 > web前端 > 怎麼在html中引入vue.js文件

怎麼在html中引入vue.js文件

藏色散人原創: 2021-02-05 09:48:2822672瀏覽

在html中引入vue.js檔案的方法：首先在Vue.js的官網上直接下載vue.js檔案；然後透過「68834d1a0e304e8c95904729593edeea”方式引入本地的vue.js檔案即可。

怎麼在html中引入vue.js文件

本文操作環境：Windows7系統、HTML5&&Vue2.2.2、Dell G3電腦。

怎麼在html中引入vue.js檔案？

Vue.js是一款流行的JavaScript前端框架，一個用於建立使用者介面的開源JavaScript框架，旨在更好地組織與簡化Web開發。

Vue所關注的核心是MVC模式中的視圖層，同時，它也能方便地獲取資料更新，並透過元件內部特定的方法實現視圖與模型的交互作用。

那麼怎麼在html中引入vue.js檔案？

方法1、可以在 Vue.js 的官網上直接下載 vue.js 文件，並用 3f1c4e4b6b16bbbd69b2ee476dc4f83a 標籤引入。

下載位址：https://vuejs.org/js/vue.min.js

然後使用3f1c4e4b6b16bbbd69b2ee476dc4f83a 標籤引入本地的vue.js檔案

<script src="vue/vue.min.js"></script>

註：vue/vue.min.js是vue.js檔案的相對位址

方法2：使用CDN 方法，用3f1c4e4b6b16bbbd69b2ee476dc4f83a 標籤引入網路中的vue.js 檔案。

以下推薦國外比較穩定的兩個 CDN，國內還沒發現哪一家比較好，目前還是建議下載到本地。

Staticfile CDN（國內） : https://cdn.staticfile.org/vue/2.2.2/vue.min.js

unpkg：https://unpkg.com/vue/dist/vue.js, 會保持和npm 發布的最新的版本一致。

cdnjs : https://cdnjs.cloudflare.com/ajax/libs/vue/2.1.8/vue.min.js

推薦：《vue教學》

Staticfile CDN（國內）

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="https://cdn.staticfile.org/vue/2.2.2/vue.min.js"></script>
</head>
<body>
<div id="app">
  <p>{{ message }}</p>
</div>
<script>
new Vue({
  el: &#39;#app&#39;,
  data: {
    message: &#39;Hello Vue.js!&#39;
  }
})
</script>
</body>
</html>

unpkg（推薦）

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="https://unpkg.com/vue/dist/vue.js"></script>
</head>
<body>
<div id="app">
  <p>{{ message }}</p>
</div>
<script>
new Vue({
  el: &#39;#app&#39;,
  data: {
    message: &#39;Hello Vue.js!&#39;
  }
})
</script>
</body>
</html>

#cdnjs

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.1.8/vue.min.js"></script>
</head>
<body>
<div id="app">
  <p>{{ message }}</p>
</div>
<script>
new Vue({
  el: &#39;#app&#39;,
  data: {
    message: &#39;Hello Vue.js!&#39;
  }
})
</script>
</body>
</html>

3f1c4e4b6b16bbbd69b2ee476dc4f83a 標籤

3f1c4e4b6b16bbbd69b2ee476dc4f83a 標籤用來定義客戶端腳本，例如JavaScript。

script 元素既可以包含腳本語句，也可以透過 src 屬性指向外部腳本檔案。

必要的 type 屬性規定腳本的 MIME 類型。

JavaScript 的常見應用時影像操作、表單驗證以及動態內容更新。

3f1c4e4b6b16bbbd69b2ee476dc4f83a 標籤的src屬性：規定外部腳本檔案的 URL。

以上是怎麼在html中引入vue.js文件的詳細內容。更多資訊請關注PHP中文網其他相關文章！

陳述：

本文內容由網友自願投稿，版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容，請聯絡admin@php.cn

上一篇：html基本結構分析下一篇：html基本結構分析

看更多