1.Vue 安装与简单使用
Hello，我是 Alex 007，一個熱愛計算機編程和硬件設計的小白，為啥是007呢？因為叫 Alex 的人太多了，再加上每天007的生活，Alex 007就誕生了。
1.Vue的安裝與簡單使用
這篇文章我們來Vue的安裝與簡單使用。
Vue的使用方式呢有很多種，第一種方式就是直接使用<script>標簽的方式去引入，第二種方式呢，大家可以使用Vue官方提供的CLI命令行工具，去快速的搭建比較復雜的腳手架。
作為初學者來講呢，強烈建議大家先不使用命令行的方式去創建Vue的應用，那當我們對這個Vue有一定的了解和學習了之后，再去使用CLI的方式去創建Vue應用。
直接用 <script> 引入
下載
那在官方文檔上的我們可以看到Vue為我們提供了兩個版本，一個是開發版本，一個是生產版本，那顧名思義，開發的時候推薦大家使用開發版本，因為它包含完整的警告和調試信息，生產環境下推薦大家使用生產版本去替換開發時使用的開發版本，因為生產版本的話經過壓縮會更小，而且刪除了一些警告信息，點擊開發版本或者是生產版本，我們可以下載并得到一個vue.js或vue.min.js這樣的一個文件。
然后我們創建一個index.html文件，通過 <script> 引入vue.js：
<!DOCTYPE html> <html><head><meta charset="utf-8"><title></title></head><body><script type="text/javascript" src="vue.js"></script></body> </html>打開網頁之后，并沒有任何的內容，我們需要打開控制臺，這時候如果我們在控制臺里面可以看見兩段提示，那就證明我們的vue.js已經成功地部署到項目里了。
CDN
CDN的本質是將媒體資源，動靜態圖片，HTML，CSS，JS等內容緩存到距離你更近的IDC，從而讓用戶進行共享資源，實現縮減站點間的響應時間等需求。
也就是說，我們不需要把vue.js下載到本地，可以直接使用網絡上的資源，省去了下載這個步驟。
<!DOCTYPE html> <html><head><meta charset="utf-8"><title></title></head><body><!-- <script type="text/javascript" src="vue.js"></script> --><script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script></body> </html>同樣可以看到兩段提示信息：
對于生產環境，推薦鏈接到一個明確的版本號和構建文件，以避免新版本造成的不可預期的破壞：
<script src="https://cdn.jsdelivr.net/npm/vue@2.6.11"></script>NPM安裝
在用Vue構建大型應用時推薦使用NPM安裝，它能夠很好的和webpack等模塊打包器配合使用。
在使用NPM之前，我們要先安裝Node.js，所謂的npm其實是Node.js的包管理工具。
去Node.js官網上下載最新的版本，目前最新版本是12.18.2.
下載好后，雙擊安裝：
Next：
Accept，Next：
改一下安裝路徑，Next：
Next：
Next：
等待安裝完成：
回車，繼續，會幫助我們自動安裝一些應用，比如Python。
Node.js安裝完成，我們來驗證一下，打開cmd，查看node版本：
同樣可以查看NPM的安裝版本：
此時NPM的本地倉庫在C盤：
Node.js安裝目錄下兩個文件夾：
執行以下兩個命令：
如果有提示，可以通過以下命令升級npm：
為了提升速度，需要配置一個鏡像站：
npm config set registry=http://registry.npm.taobao.org檢查配置是否成功：
npm config get registry
通過NPM安裝Vue：
安裝文件在如下目錄：
通過npm安裝的Vue新建項目：
安裝完成之后，可以通過命令行直接運行項目：
cd npmVueProject npm run dev
打開瀏覽器，輸入網址就可以看到Vue項目了：
項目文件：
到此為止，我們Vue的安裝與簡單使用就講完了，接下來我們就進入正式的Vue學習。
與50位技術專家面對面20年技術見證，附贈技術全景圖總結
以上是生活随笔為你收集整理的1.Vue 安装与简单使用的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： npm : 无法加载文件 D:\Prog
- 下一篇： html5倒计时秒杀怎么做,vue 设