前端vue專案啟動

2021-09-26 07:31:10 字數 834 閱讀 3524

(1)裝好nodejs,最新版本6.10以上的好像都能自動配置路徑和npm啥的,反正裝好後在任意路徑下用cmd查"node --version"或者"npm -v"都能給出版本號,不用像一些其他教程一樣還要配置環境變數。

(2)切換npm映象:在任意路徑下用cmd輸入「npm install -g cnpm --registry= 這樣就能用**的npm映象代替國外的資源。

(4)npm全域性安裝vue:仍舊在任意路徑的cmd下輸入「cnpm install vue-cli -g」,安裝vue。成功後輸入vue能出來資訊。

(6)npm編譯:第一次執行前,要對專案進行編譯,cmd進入前端vue專案的根目錄,輸入命令「npm run build」,此時會對根目錄下的package.json對build命令的定義進行編譯,一般"build" = "webpack -p"。

(7)配置nginx:前後端分離專案一般都要解決跨域問題,上nginx吧,配好nginx安裝目錄/conf/nginx.conf的server模組。

(9)配置windows的hosts:由於是在本機上啟用前端專案,需要將127.0.0.1和nginx**後的網域名稱做對應。找到系統的hosts檔案(win7系統下在c:\windows\system32\drivers\etc裡面),增加一條「127.0.0.1 $」。否則本地啟動前端專案後瀏覽器訪問nginx**後的網域名稱會發生dns錯誤。

(10)啟動nginx

(11)啟動專案:cmd進入前端vue專案的根目錄,輸入命令「npm run dev」,此時會用nodejs啟動這個前端的vue專案。大功告成。

vue前端專案工作

專案工作開始從配置檔案開始因為是團隊合作從url 配置檔案 打包目錄模組管理,vuex,元件,檢視,混入mixins,從命名規範,語法規範,eslint規則,通過與產品溝通需求,與後端聯調介面,通過傳送的請求,了解資料。寫好注釋,讓別人看的明白,養成習慣,規範多了,合作起來容易,尤其是專案很大,頁面...

vue專案啟動報錯

參考 webpack dev server 20 inline 20 progress 20 config 20build webpack.dev.conf.js 因為自己對前端基礎框架不是很了解,所以踩坑就記錄了,暫時記錄下,哈哈 刪除 node modules 目錄,再重新安裝依賴包 npm i...

Nginx 部署Vue前端專案

npm run build構建成功後基本會在配置的dist檔案下生成靜態html檔案。把生成目錄dist裡的檔案打包上傳至伺服器 192.168.234.97 scp dist.zip root 192.168.234.97 opt www vue base輸入伺服器登入密碼。上傳到伺服器靜態位址 ...