vue 文件引入1

時間 2019-12-20

標籤 vue 文件引入简体版

原文原文鏈接

直接 `<script>` 引入

直接下載並用 <script> 標籤引入，Vue 會被註冊爲一個全局變量。重要提示：在開發時請用開發版本，遇到常見錯誤它會給出友好的警告。html

開發環境不要用最小壓縮版，否則就失去了錯誤提示和警告!前端

開發版本包含完整的警告和調試模式

生產版本刪除了警告，30.33kB min+gzip

CDN

推薦：https://cdn.jsdelivr.net/npm/vue，會保持和 npm 發佈的最新的版本一致。能夠在 https://cdn.jsdelivr.net/npm/vue/ 瀏覽 npm 包資源。vue

也能夠從 unpkg 和 cdnjs 獲取 (cdnjs 的版本更新可能略滯後)。webpack

NPM

在用 Vue.js 構建大型應用時推薦使用 NPM 安裝，NPM 能很好地和諸如 Webpack 或 Browserify 模塊打包器配合使用。Vue.js 也提供配套工具來開發單文件組件。git

# 最新穩定版

$ npm install vue

命令行工具 (CLI)

Vue.js 提供一個官方命令行工具，可用於快速搭建大型單頁應用。該工具提供開箱即用的構建工具配置，帶來現代化的前端開發流程。只需幾分鐘便可建立並啓動一個帶熱重載、保存時靜態檢查以及可用於生產環境的構建配置的項目：github

 
     # 全局安裝 vue-cli 
    
      $ npm install --global vue-cli 
    
     # 建立一個基於 webpack 模板的新項目 
    
      $ vue init webpack my-project 
    
     # 安裝依賴，走你 
    
      $  
     cd my-project 
    
      $ npm install 
    
      $ npm run dev

CLI 工具假定用戶對 Node.js 和相關構建工具備必定程度的瞭解。若是你是新手，咱們強烈建議先在不用構建工具的狀況下通讀指南，熟悉 Vue 自己以後再研究 CLI。web

譯者注：對於大陸用戶，建議將 npm 的註冊表源設置爲國內的鏡像，能夠大幅提高安裝速度。ajax

對不一樣構建版本的解釋

在 NPM 包的 dist/ 目錄你將會找到不少不一樣的 Vue.js 構建。這裏列出了他們之間的差異：vue-cli

	UMD	CommonJS	ES Module
完整版	vue.js	vue.common.js	vue.esm.js
只包含運行時	vue.runtime.js	vue.runtime.common.js	vue.runtime.esm.js
完整版 (生產環境)	vue.min.js	-	-
只包含運行時 (生產環境)	vue.runtime.min.js	-