如何執行vue專案(維護他人的專案)

2021-08-22 09:54:22 字數 1803 閱讀 8329

假如你是個小白,在公司接手他人的專案,這個時候,該怎麼將這個專案跑通?

前提:

首先,這個教程主要針對vue小白,並且不知道安裝node.js環境的。言歸正傳,下面開始教程:在維護專案之前,需要把所有的環境搭建好,這裡我就不多說了,看這篇就夠了:十分鐘上手-搭建vue開發環境(新手教程)

好了,再重複具體不嫌麻煩的把步驟操作一遍,做技術就得孰能生巧,一遍又一遍不斷的重複

如下:1:安裝cnpm

由於npm有些資源被遮蔽或者是國外資源的原因,經常會導致用npm安裝依賴包的時候失敗,所有我還需要npm的國內映象---cnpm

在命令列中輸入 npm install -g cnpm --registry=

2:安裝webpack

npm install webpack -g

webpack是一款模組載入器兼打包工具,它能把各種資源,例如js(含jsx)、coffee、樣式(含less/sass)、等都作為模組來使用和處理。 webpack 的核心是 依賴分析,把依賴分析出來了,其他都是細枝末節。

3:安裝vue-cli

cnpm install vue-cli -g

vue-cli是vue.js的腳手架,用於自動生成vue.js+webpack的專案模板

,這個過程會耗時十幾秒,等走完就好;好了,到此整個環境就搭建好了

4:cd /專案名稱

下面就是執行專案了,cd /專案名稱,我的檔案放在d盤,所以先進入d盤,再進入專案。

進入專案之後安裝依賴,安裝成功

注意:在這一步可能會出現這樣的錯誤;因為你開啟的是別人的專案,專案之中肯定有 node_modules模組,那麼先刪除掉,在執行npm install命令

如果出現了,請參考這篇文章解決:

6:npm run dev

一切準備就緒,啟動專案

7:自動啟動瀏覽器就會開啟專案了

在瀏覽器中輸入http://localhost:8080/#/;進入專案首頁

若是要訪問其他頁面,直接在#後面加上元件名稱即可:例如http://localhost:8080/#/adjustintegral 注:

如何執行vue專案

通過查閱網上教程,成功搭建好專案環境,同時對前段工程化有了朦朦朧朧的認知,因此將環境搭建過程分享給大家。首先,列出來我們需要的東西 安裝node.js從 安裝完成之後,開啟命令列工具,輸入 node v,如下圖,如果出現相應的版本號,則說明安裝成功。npm包管理器,是整合在node中的,所以,直接輸...

如何執行vue專案

在師兄的推薦下入坑vue.js 發現不知如何執行github上的開源專案,很尷尬。通過查閱網上教程,成功搭建好專案環境,同時對前段工程化有了朦朦朧朧的認知,因此將環境搭建過程分享給大家。可以看下我的github 裡面有我學習 工作寫的一些vue專案。言歸正傳 首先,列出來我們需要的東西 安裝node...

如何執行vue專案

首先,列出來我們需要的東西 安裝node.js 安裝完成之後,開啟命令列工具,輸入 node v,如下圖,如果出現相應的版本號,則說明安裝成功。npm包管理器,是整合在node中的,所以,直接輸入 npm v就會如下圖所示,顯示出npm的版本資訊。ok!node環境已經安裝完成,npm包管理器也有了...