vue初始化專案

2021-10-24 07:45:11 字數 1387 閱讀 4171

1、初始化專案:

命令:f:\vueworkspace>vue init webpack demo-project

2、建立好的專案目錄結構:

其中:build—專案構建(webpack)相關**

檔案說明

build.js

生產環境構建指令碼

check-versions.js

檢查npm、node.js版本

utils.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

生成環境變數

檔案說明

assets

資源目錄,防止一些或公共js、公共css,這裡的資源會被webpack構建

components

元件目錄,我們寫的元件就放在這個目錄

router

前端路由,我們需要配置的路由路徑寫在index.js裡

根元件main.js

入口js檔案

static—靜態資源目錄

test—初始測試目錄,可以刪除

index.html—首頁入口檔案,可以新增一些meta資訊等

package.json—專案配置檔案

.***x檔案—一些配置檔案,包括語法配置,git配置等

readme.md—專案說明文件,為markdown格式

3、啟動:

命令:f:\vueworkspace\demo-project>npm run dev

vue初始化專案

速查 vue v npm v sudo npm install global vue cli sudo npm install g vue cli init 進入包下 vue init webpack home檢查node和npm版本 node vv14.3.0 npm v6.14.5 安裝vue ...

Vue初始化專案指南

如果報npm安裝vue超時 err errno etimedout 採用cnpm映象就可以解決了 npm install g cnpm registry npm registry info underscore再執行命令 npm install vue cli g 安裝完之後建立專案 vue ini...

vue專案初始化詳細步驟

第二步 安裝vue cli手腳架 在cmd下執行命令cnpm install vue cli g 第三步 進入需要新建專案的目錄 cd d test 第四步 執行命令 vue init webpack demo 注 demo是專案名稱 第五步 顯示project nanme 目錄名 回車 proje...