VUE搭建步驟

搭建vue專案環境

vue目錄簡介

開始我們的第乙個vue專案

eslint **格式

vetur

tortoisesvn svn小烏龜

環境變數配置

配置環境變數後，驗證是否成功

node -v

npm -v

npm install -g cnpm –registry=

cnpm -v 檢查安裝成功

npm install --global vue-cli

vue build ==> 打包方式，回車即可；

install vue-router ==> 是否要安裝 vue-router，專案中肯定要使用到 所以y 回車；

use eslint to lint your code ==> 是否需要 js 語法檢測 可是**更工整 所以 y 回車；

set up unit tests ==> 是否安裝 單元測試工具 目前我們不需要 所以 n 回車；

setup e2e tests with nightwatch ==> 是否需要 端到端測試工具 目前我們不需要 所以 n 回車；

cnpm i

build.js ==> 生產環境構建指令碼；

check-versions.js ==> 檢查npm，node.js版本；

utils.js ==> 構建相關工具方法；

vue-loader.conf.js ==> 配置了css載入器以及編譯css之後自動新增字首；

webpack.base.conf.js ==> webpack基本配置；

webpack.dev.conf.js ==> webpack開發環境配置；

webpack.prod.conf.js ==> webpack生產環境配置；

dev.env.js ==> 開發環境變數；

index.js ==> 專案配置檔案；

prod.env.js ==> 生產環境變數；

components：元件目錄，我們寫的元件就放在這個目錄裡面；

router：前端路由，我們需要配置的路由路徑寫在index.js裡面；

main.js：入口js檔案；

index.html：首頁入口檔案，可以新增一些 meta 資訊等

package.json：npm包配置檔案，定義了專案的npm指令碼，依賴包等資訊

readme.md：專案的說明文件，markdown 格式

.***x檔案：這些是一些配置檔案，包括語法配置，git配置等

在components目錄下新建乙個views目錄，裡面寫我們的vue元件

開始我們的第乙個元件：

在views目錄下新建first.vue

3. 在router目錄下的index.js裡面配置路由路徑

import vue from 'vue'

import router from 'vue-router'
import helloworld from '@/components/helloworld'
import first from '@/components/views/first'
vue.use(router)
export default new router(,
]})

Vue快速搭建步驟

安裝npm 安裝vue 全域性安裝 vue cli 建立vue 模板 sudo vue init webpack my project project name 專案名 project description 專案名描述 author 作者郵箱 use eslint to lint your cod...

vue環境搭建步驟

vue.js是前端乙個比較火的mvvm框架，要使用它，我們必須提前配置，其中有一種安裝方式是使用npm，比較適合比較大型的應用。今天就來看看這種方式如何操作，由於npm是國外的，使用起來比較慢，我們這裡使用 的cnpm映象來安裝vue.1.開啟命令列視窗，輸入 獲取到cnpm以後，我們需要公升級一下...

vue環境搭建步驟

安裝2 檢視node是否安裝成功 windows r cmd 開啟命令列 輸入 node v 檢視node版本，node版本需要 8.9 使用的時候 寫cnpm，等同於npm 4 安裝vue cnpm install vue g5 安裝腳手架 cli 如果之前已經安裝過舊版本 非3.x 腳手架，需要...