第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

1. 前言

本小節(jié)將帶領(lǐng)大家學習一下如何安裝 Vue。包括獨立版本、CDN、NPM、CLI 工具四種不同的安裝方法。

2. 獨立版本

我們可以在 Vue.js 的官網(wǎng)上直接下載 vue.min.js 并用<script>標簽引入。

安裝步驟:

  1. 打開Vue.js下載地址并拷貝所有代碼。
  2. 創(chuàng)建vue.min.js文件,并將拷貝的源碼粘貼進去。
  3. 創(chuàng)建index.html并通過<script>標簽引入。
  4. 打印Vue驗證是否成功。
//文件結(jié)構(gòu)
└─ lession
   ├─ index.html
   └─ vue.min.js
實例演示
預覽 復制
復制成功!
<!DOCTYPE html>
  <html lang="en">
  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
  </head>
  <body>
    <div id="app">
      Hello Imooc !
    </div>
  </body>
  <script src="./vue.min.js"></script>
  <script type="text/javascript">
    console.log(Vue)
  </script>
</html>
運行案例 點擊 "運行案例" 可查看在線運行效果
## 打印結(jié)果
? wn(e){this._init(e)}

3. 使用 CDN 方法

使用 CDN 的方式引入Vue更加方便、快捷。以下推薦幾個比較穩(wěn)定的 CDN。

實例演示
預覽 復制
復制成功!
<!DOCTYPE html>
  <html lang="en">
  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
  </head>
  <body>
    <div id="app">
      Hello Imooc ! 
    </div>
  </body>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.1.8/vue.min.js"></script>
  <script type="text/javascript">
    console.log(Vue)
  </script>
</html>
運行案例 點擊 "運行案例" 可查看在線運行效果

4. 使用NPM的方法

使用NPM的方法進行安裝需要先在本地安裝Node環(huán)境。

3.1、Windows 上安裝 Node.js

32 位安裝包下載地址
64 位安裝包下載地址
下載對應(yīng)的安裝包后,雙擊安裝包,傻瓜式下一步安裝就好了。

3.2、Mac 上安裝 Node.js

1、在官方下載網(wǎng)站下載 pkg 安裝包,直接點擊安裝即可。
2、使用 brew 命令來安裝:brew install node

brew install node
# 查看本地node環(huán)境
$ node -v
v10.16.0

在用 Vue 構(gòu)建大型應(yīng)用時推薦使用 NPM 安裝。當然,僅僅使用npm install是不能完整搭建Vue開發(fā)環(huán)境的。還需要webpackBrowserify 等模塊打包器配合使用。

# 創(chuàng)建項目目錄
$ mkdir demo

# 進入項目文件夾
$ cd demo
$ npm init -y

# 最新穩(wěn)定版
$ npm install vue

# 安裝指定版本Vue
$ npm install vue@2.6.3

安裝完成后可以查看到demo目錄下多了 node_module/vue 文件夾。說明Vue成功安裝。

5. 命令行工具(CLI)

當然,看過 Vue 官網(wǎng)的同學肯定都知道 Vue 提供了一個官方的 CLI,為我們快速搭建大型單頁應(yīng)用。我們并不建議同學們在一開始就使用 Vue-cli 來構(gòu)建項目,因為這需要同學們對 Node.jsWebpack 等技術(shù)有所了解。在熟悉了 Vue 的語法之后,我們將有一個完整的章節(jié)來學習和使用 Vue-cli

6. 小結(jié)

本小節(jié)我們介紹了 Vue 安裝的幾種方式。作為初學者,我們建議同學們先使用第一、第二種方式進行學習。在對 Vue 有一定的了解之后再學習腳手架工具 Vue-Cli 的使用。在接下來 Vue 基礎(chǔ)的章節(jié)中我們都將使用 <script src="https://unpkg.com/vue/dist/vue.js"></script> 的方式進行代碼演示。關(guān)于腳手架工具 Vue-Cli 的學習,我們將在最后一個章節(jié)中一起探討。