配置環(huán)境
Npm :用淘寶鏡像 cnpm
$ npm install -g cnpm --registry=https://registry.npm.taobao.org
error:Error: EACCES: permission denied,
沒有權限
可以使用
sudo npm install -g cnpm --registry=https://registry.npm.taobao.org來安裝,是用管理員的權限安裝
安裝完成后可以使用cnpm來代替npm了
接下來安裝vue
cnpm install vue
安裝webpack:
cnpm install -g webpack
Vue.js 提供一個官方命令行工具赂蕴,可用于快速搭建大型單頁應用贾陷。
安裝vue-cli:
cnpm install --global vue-cli
創(chuàng)建一個項目
vue init webpack first-vue
? Project name firstvue
? Project description first vue project
? Author jerry
? Vue build standalone
? Install vue-router? Yes //是否使用vue-router
? Use ESLint to lint your code? Yes
? Pick an ESLint preset Standard
? Set up unit tests Yes
? Pick a test runner jest
? Setup e2e tests with Nightwatch? Yes
? Should we run `npm install` for you after the project has been created? (recomme
nded) npm
? vue-cli · Generated "my-project".
cd 進入項目文件夾
npm install
npm run dev
95% emitting? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? s? ?
DONE? Compiled successfully in 3337ms? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? 21:32:39
I? Your application is running here: http://localhost:8080
復制http://localhost:8080到瀏覽器打開,如果出現(xiàn)Vue的官網(wǎng)logo及相關內(nèi)容翰舌,則項目初始化成功
如果上面創(chuàng)建項目時? Install vue-router?選擇yes,項目會直接配置好router冬骚,目錄結(jié)構(gòu)如圖所示:
打開index.js,
瀏覽器打開http://localhost:8080/#/login椅贱,看下是不是可以訪問到自己寫的vue組件懂算,
接下來我們可以開始開發(fā)了,
簡單的項目初始化完成庇麦,我們可以開始我們的第一個vue項目了