vue專案搭建步驟

2022-08-23 20:27:10 字數 1014 閱讀 3344

一、安裝環境:

二、搭建vue專案環境

npm install vue

全域性安裝 vue-cli:

cnpm install --globalvue-cli

vue init webpack 專案名稱:

三、安裝並執行專案:

cd (專案名稱) 進入專案檔案中

npm install

npm run dev   執行專案

四、專案目錄(初始):

build:構建指令碼目錄

build.js:生產環境構建指令碼;

check-versions.js:檢查npm,node.js版本;

vue-loader.conf.js: 配置了css載入器以及編譯css之後自動新增字首;

webpack.base.conf.js:webpack基本配置;

webpack.dev.conf.js: webpack開發環境配置;

webpack.prod.conf.js:webpack生產環境配置;

config:專案配置

dev.env.js:開發環境變數;

index.js:專案配置檔案;

prod.env.js : 生產環境變數;

test.env.js :測試環境變數;

node_modules:npm 載入的專案依賴模組

src:開發的目錄:

components:元件目錄;

router:前端路由;

main.js:入口js檔案;

static:靜態資源目錄(不會被webpack構建)

index.html:首頁入口檔案

test :測試檔案目錄;

package.json:npm包配置檔案,定義專案的npm指令碼,依賴包等資訊

readme.md:專案的說明文件

搭建vue專案步驟詳解

檢查是否安裝成功 如果輸出版本號,說明我們安裝node環境成功 為了提高我們的效率,可以使用 的映象 輸入 npm install g cnpm registry 即可安裝npm映象,以後再用到npm的地方直接用cnpm來代替就好了。檢查是否安裝成功 1.全域性安裝vue cli 2.進入你的專案目...

搭建vue專案環境步驟

npm install global vue cli 1 儀錶盤外掛程式中新增外掛程式,搜尋 vue cli plugin element安裝 2 安裝完成,在配置外掛程式中,第一項選擇import on demand 按需手動配置 1 儀錶盤依賴中安裝依賴,執行依賴中搜尋axios,進行安裝 2 ...

VUE搭建步驟

搭建vue專案環境 vue目錄簡介 開始我們的第乙個vue專案 eslint 格式 vetur tortoisesvn svn小烏龜 環境變數配置 配置環境變數後,驗證是否成功 node v npm v npm install g cnpm registry cnpm v 檢查安裝成功 全域性安裝v...