先裝好 node 裝npm
持久使用淘寶鏡像cnpm?
配置:npm configsetregistry https://registry.npm.taobao.org
驗證:npm configgetregistry
通過cnpm使用:npm install -g cnpm --registry=https://registry.npm.taobao.org
直接使用 cnpm install ***
(如果提示 不是內部指令 需要在查找vue.cmd的路徑放在path環(huán)境變量中)
全局安裝 webpack
cnpm install webpack -g
全局安裝vue-cli
cnpm install vue-cli -g
檢測vue版本
vue -V
項目初始化?
vue init webpack +項目名稱
輸入命令后,會詢問我們幾個簡單的選項腕柜,我們根據(jù)自己的需要進行填寫就可以了纪隙。
Project name :項目名稱 聂儒,如果不需要更改直接回車就可以了墓懂。注意:這里不能使用大寫郎楼,所以我把名稱改成了vueclitest
Project description:項目描述,默認為A Vue.js project,直接回車,不用編寫举哟。
Author:作者,如果你有配置git的作者迅矛,他會讀取妨猩。
Install ?vue-router? 是否安裝vue的路由插件,我們這里需要安裝秽褒,所以選擇Y
Use ESLint to lint your code? 是否用ESLint來限制你的代碼錯誤和風格壶硅。我們這里不需要輸入n,如果你是大型團隊開發(fā)销斟,最好是進行配置庐椒。
setup unit tests with ?Karma + Mocha? 是否需要安裝單元測試工具Karma+Mocha,我們這里不需要蚂踊,所以輸入n约谈。
Setup e2e tests with Nightwatch?是否安裝e2e來進行用戶行為模擬測試,我們這里不需要犁钟,所以輸入n棱诱。
下載依賴包
cnpm i
跑起來
npm run dev
項目結構
幾個重要的文件
package,json
scripts 里 命令行里執(zhí)行的命令具體做了什么 在這里有一一對應
dependencies 里 生產環(huán)境中依賴的包 (客戶要運行的)
devDependencies 開發(fā)環(huán)境中依賴的包
webpack.base.conf.js
webpack的基本配置文件
entry 入口文件
eoutput 出口文件
babelrc
es6轉化為es5的配置
npm run build 打包
生成的dist目錄就是打包后上傳到服務器的文件