vue專案搭建

在使用vue搭建乙個專案時，有一下兩種方法：

script指令碼引入

cli腳手架的方法（①從github轉殖；②npm安裝）

一、指令碼引入方法

官網裡是這樣介紹的：

① 對於製作原型或學習，你可以這樣使用最新版本：

""

>
<
/script>

""

>
<
/script>

以上指令碼引入這兩個方法，根據你的需求引入乙個即可；

注意：vue腳手架安裝，前提必須有：vue、node.js、npm

① github官網轉殖安裝vue腳手架。

// 找乙個空的資料夾，在當前資料夾下開啟cmd，執行以下命令（轉殖）：

//（轉殖好以後，就已經安裝好vue腳手架了）
// 移動到轉殖好的資料夾下的vue目錄下：
cd node_modules/vue
// 安裝依賴包
npm i
// 此時，乙個完整的vue腳手架已經搭建完畢。可以正常寫自己的專案了。
// 如果，需要預覽頁面，可以執行： (瀏覽器中輸入 localhost:8080 回車)
npm start
// 如果，要打包專案，可以執行：
npm run build

// 同上，需要在空的目錄下開啟cmd，執行

npm i vue // （沒有vue的，需要安裝下vue，要不後面會提示vue不是內部或外部命令）
// 腳手架安裝
npm i -g @vue/cli
// 安裝完成後，可以測試一下是否安裝成功(如果出現版本號，說明安裝成功！）
vue -
v// 注意：這裡的v是大寫！
// 使用腳手架建立乙個vue專案：
vue init webpack mypro1 // mypro1是專案名稱，可以自行修改
/* 
**這裡會有一些腳手架初始化的配置詢問：**
1.project name：專案名，可以直接回車（預設mypro1），也可以自己修改。
2.project description：專案描述，直接回車
3.author：作者是誰，隨便填或直接回車
4.vue build：選擇題，一般選第乙個
4.1 runtime + compiler: recommended for most users//執行加編譯，官方推薦，就選它了
4.2 runtime-only: about 6kb lighter min+gzip, but templates (or any vue-specific html) are only allowed in .vue filesrender functions are required elsewhere//僅執行時，已經有推薦了就選擇第乙個了
6.use eslint to lint your code：是否用eslint來限制你的**錯誤和風格。n 新手就不用了，但實際專案中一般都會使用。
7.set up unit tests：是否安裝單元測試 ，輸入n
8.setup e2e tests with nightwatch?：是否安裝e2e測試，輸入 n
9.should we run `npm install` for you after the project has been created? (recommended) (use arrow keys) yes, use npm 選擇npm。
繼續回車，這樣就好了，靜待安裝即可！
*/// 以上步驟，腳手架安裝完畢
// 接下來，進入到專案目錄下：
cd mypro1
// 同上，預覽專案，執行: (瀏覽器中輸入 localhost:8080 回車)
npm start
// 打包專案，執行
npm run build

vue專案搭建

前提安裝好node不再贅述 可以在自帶的命令列中執行,也可以在webstome中執行 安裝cnpm npm install g cnpm registry 安裝webpack 這一步可以省略,反正你也不會用 cnpm install webpack g 全域性安裝 vuecnpm install g...

Vue專案搭建

vue cli 專案搭建及常用外掛程式安裝，報錯解決 環境搭建 node v 檢測版本 2.安裝webpack npm install webpack g webpack v 檢測是否安裝成功 專案搭建 1.npm install vue cli g vue v 接下來的步驟有兩種方式 1 cd 進...

vue專案搭建

1 安裝 映象，用cnpm裝東西很省事，目前沒被坑過 一下命令在cmd中完成 可以不按裝 npm install g cnpm registry 2 安裝vue腳手架 cnpm install g vue cli測試是否成功安裝 vue v 3.進入安裝的資料夾目錄，構建檔案結構目錄 vue ini...