1、安裝vue執行環境
安裝nodejs:
目錄:d:\program files\nodejs
勾選:add to path
安裝完成後
設定快取資料夾
npm config set cache "d:\program files\nodejs\node_cache"
設定全域性模組存放路徑
npm config set prefix "d:\program files\nodejs\node_global"
安裝cnpm
npm
install -g cnpm --registry=
設定環境變數
1、path新增:d:\program files\nodejs\node_global
2、新建系統變數node_path:d:\program files\nodejs\node_modules
關閉命令列重新開啟。
安裝vue
cnpm install vue -g
安裝vue-cli 腳手架
cnpm install vue-cli -g
3、執行已有的專案
已有專案一般不會把node_modules放在svn, git裡面,因為 node_modules 比較大而且它依賴於外層目錄,比如,你把乙個專案移到另外乙個地方同時把 node_modules 移動過去,npm run dev 發現出錯了
此時需要:
刪除專案中node_modules資料夾 ,
執行npm cache clean --force
命令清除掉cache快取,
4、npm run dev 與 npm run build 的區別
npm run dev 做了兩件事情:提供 web server + 及時 build 。
首先它會build專案**到當前目錄的dist
目錄下,如下
就是上面的訪問位址。
我們還知道,dev模式下,根目錄(/) 指的就是專案目錄,也就是 admin-web 目錄,所以 在 config/index/js 中 dev 應該這麼配置。
然後監聽8080埠,提供 web server 訪問,如果你的**有變動,它會及時build。
npm run build 只做了 build 的工作,你需要將生成的 dist 目錄複製到 web server 根目錄下,比如nginx,因為對於線上環境,vue提供的微型web server是扛不住的,在 build 的時候會根據config/index.js
中的 build 模組的設定來打包專案,在此你可以指定nginx的專案根目錄即可。比如,我上面的專案 admin-web 就在nginx根目錄下,我在本地 npm run build 之後,直接將 admin-web 整個提交到svn,然後線上svn up。
我的線上訪問位址為http://ip/admin-web/dist/index.html#/
,所以我設定的 build 引數為:
打包發布VUE專案
適用於前後端分離專案,主要是打包前端 核心命令 cnpm install cnpm run build就1個是安裝依賴包,1個是構建專案,最後生成 dist index.html static把這個推到環境就可以了 從我目前的線上經驗上呢 也遇到一些問題的 1.涉及到開發那邊新增了模組,我們這邊打包...
nginx 發布vue專案
打包成功後,複製到伺服器。我的專案目錄是 usr local soft nginx web micro mall h5 2 進入nginx安裝目錄下的 conf nginx.conf檔案修改相關配置 listen配置埠這裡預設是80 修改location內容 當訪問http localhost 80...
vue專案打包發布
打包 1 修改config裡面的index.js裡面的productionsourcemap為false,預設情況是true true代表打包環境是開發環境,可以進行除錯 false表示生產環境,正式上線的 2 找到assetspublicpath 鍵 將它從 變為了 3 在cmd裡面執行npm r...