前提：安裝好node並配置好，此處不贅述。
一.package.json
2.進入文件夾執行命令。
我在F盤建了一個bukesibooks文件夾，進入后執行命令npm init。
回車后會出現如下信息，一一填寫確認即可，或者直接執行命令npm init -y，這樣所有信息都默認。
於是bukesibooks文件夾里出現了package.json文件。
3.安裝需要用的包。
開發過程需要，產品上線后不需要的包安裝時使用npm install xxx --save-dev命令(--save-dev可以縮寫為-D)，產品上線后需要用的包安裝時使用npm install xxx --save命令(--save可以縮寫為-S)。
安裝成功后，package.json文件是下圖這樣，devDependencies是開發過程需要的包，dependencies是產品上線后需要用的包，為什么要安裝這些包會在《(三)項目中的webpack配置》中說明，現在把它們裝好就行。
注意事項：
-
如果用npm安裝包很慢，可以使用cnpm淘寶鏡像，參考這里http://npm.taobao.org/
-
如果安裝過程太慢卡住了等等退出安裝的情況，重新安裝最好把項目根目錄下的node_modules文件夾刪了再重新安裝，因為上次安裝中斷可能會導致某些包被破壞或缺損。
-
如果不想一個個包輸入安裝，可以復制別人完整的package.json文件，然后再在項目根目錄下執行命令npm install就可以安裝文件里的包，就像在github上一些項目不會有node_modules文件夾(因為這個文件夾很大)，你clone到本地執行命令npm install，就可以安裝該項目對應需要的包了。
4.package.json文件中的"script"修改如下圖。
修改之后就可以使用npm run dev命令使用webpack-dev-server，運行命令后它會根據webpack.config.js文件配置實時打包但不會在物理內存中生成文件，使用npm run build命令使用webpack，它會根據webpack.prod.js文件配置生成打包后的文件。
二.webpack配置
1.webpack配置文件有兩個，webpack.config.js開發環境使用和webpack.prod.js生產環境使用，因為項目生產環境下需要更簡潔輕量的代碼，所以需要壓縮html/css/js等等操作，而開發環境下不需要，所以生產環境的打包配置要多一些。
2.項目根目錄下新建這兩個文件，里面包含入口文件是哪個、輸出文件和路徑是什么，哪些文件要處理(因為瀏覽器不認識vue/less/scss文件，webpack可以將其處理成瀏覽器看的懂得內容)，ES6轉ES5，要不要壓縮等等配置。應該怎么配置會在《(三)項目中的webpack配置》中說明。
三..babelrc
項目中用了ES6語法，要轉為低版本js語法除了要在webpack配置文件配置外，還要建一個babel配置文件.babelrc，配置內容也可以寫在webpack配置文件里。
四..gitignore
要將項目上傳到github，那可以新建一個.gitignore文件，里面寫不需要上傳到github的文件。
五.其他
新建文件夾src和mock，新建文件README.md，src文件夾放項目具體內容，mock下的文件用作模擬項目請求的假數據，README.md文件寫項目介紹，package-lock.json文件作用是鎖定包的版本，它自己生成，不用管它。現在項目根目錄下有這些內容：
六.src文件夾
components子組件文件夾，static放css/img等靜態文件，App.vue組件入口，index.html頁面入口，main.js是js入口，router.js寫路由配置，store.js寫vuex配置。
