[npm和node是雙胞胎屯远,一起安裝的金麸,安裝教程,點(diǎn)擊跳轉(zhuǎn)]
1、安裝vue-cli 全局
npm install vue-cli -g
這里有個(gè)問題套鹅,在安裝之后出現(xiàn):vue: command not found
那么就用:sudo npm install -g vue-cli
來安裝
在安裝過程中。出現(xiàn):長時(shí)間停留在fetchMetadata: sill mapToRegistry
解決辦法
更換成淘寶的源
npm config set registry https://registry.npm.taobao.org
– 配置后可通過下面方式來驗(yàn)證是否成功
npm config get registry
– 或npm info express
成功后可以查看可以用的模板
vue list
2汰具、cd 到你自己的項(xiàng)目目錄
3卓鹿、使用vue-cli初始化項(xiàng)目:
vue init webpack-simple 你的工程名字
初始化中遇到:
Project name (vue-test)直接回車默認(rèn)
Project description (A Vue.js project) 直接回車默認(rèn)
Author 寫你自己的名字
Use sass 使用sass(CSS擴(kuò)展語言)
//上面是用的簡易版,我之前就是用的簡易版郁副,然后就出現(xiàn)好多問題减牺,需要加各種依賴和配置
//后來為了方便,我直接不新建簡易版了
vue init webpack 你的工程名字
命令輸入后存谎,會(huì)進(jìn)入安裝階段拔疚,需要用戶輸入一些信息
Project name (vuetest) 項(xiàng)目名例子 cue-test-project (注意這里的名字不能有大寫字母,推薦用-隔開既荚,如果有會(huì)報(bào)錯(cuò)Sorry, name can no longer contain capital letters)稚失,阮一峰老師博客[為什么文件名要小寫](http://www.ruanyifeng.com/blog/2017/02/filename-should-be-lowercase.html)
Project description (A Vue.js project) 項(xiàng)目描述
Author (........) 作者
Runtime + Compiler: recommended for most users 運(yùn)行加編譯,既然已經(jīng)說了推薦恰聘,就選它了
Runtime-only: about 6KB lighter min+gzip, but templates (or any Vue-specificHTML) are ONLY allowed in .vue files - render functions are required elsewhere 僅運(yùn)行時(shí)句各,已經(jīng)有推薦了就選擇第一個(gè)了
Install vue-router? (Y/n) 是否安裝vue-router吸占,[vue-router官網(wǎng)](http://router.vuejs.org/zh-cn/) 。這里就輸入“y”后回車即可凿宾。
Use ESLint to lint your code? (Y/n) 是否使用ESLint管理代碼矾屯,ESLint是個(gè)代碼風(fēng)格管理工具,是用來統(tǒng)一代碼風(fēng)格的初厚,并不會(huì)影響整體的運(yùn)行件蚕,這也是為了多人協(xié)作,新手就不用了产禾,一般項(xiàng)目中都會(huì)使用排作。[ESLint官網(wǎng)](http://eslint.org/)
Standard (https://github.com/feross/standard) 標(biāo)準(zhǔn)(https://github.com/feross/standard)github地址看一下,js的標(biāo)準(zhǔn)風(fēng)格
AirBNB (https://github.com/airbnb/javascript) JavaScript最合理的方法亚情,這個(gè)github地址說的是JavaScript最合理的方法
none (configure it yourself) 自己定義風(fēng)格
Setup unit tests with Karma + Mocha? (Y/n) 是否安裝單元測試
Setup e2e tests with Nightwatch(Y/n)? 是否安裝e2e測試
4妄痪、cd 命令進(jìn)入創(chuàng)建的工程目錄
5、安裝項(xiàng)目依賴
npm install
最好使用--save楞件,自動(dòng)配置package.json
npm install express-session --save
6衫生、運(yùn)行項(xiàng)目
npm run dev
這里可能會(huì)出現(xiàn)很多問題:
大多數(shù)問題都是依賴文件沒有添加或者更新的問題
按照提示,一個(gè)一個(gè)改就好
PS:
1:更新vue-cli
npm install -g vue-cli
或者需要權(quán)限
sudo npm install -g vue-cli