Vue cli vue腳手架 安裝

準備工作：

首先安裝node 和 npm（不會安裝的話請參考：並且保證node版本是v6及以上，話不多說，上圖

安裝和解除安裝：

一. 安裝

1.安裝2.x

//

安裝npm install vue-cli -g
//版本檢視
vue -v 或者 vue -version
2.安裝3.x 或 4.x
//

安裝cnpm install @vue/cli -g 
//備註：因網路問題，改用cnpm安裝，等同於 npm install @vue/cli -g 
3.備註
//

cnpm 的使用
////
使用辦法：
//首先安裝 cnpm：
//然後使用方法等同於npm
如：cnpm install -g @vue/cli 等同於 npm install -g @vue/cli
二. 解除安裝

1.解除安裝2.x
//

解除安裝npm uninstall vue-cli -g
2.解除安裝 3.x 或者 4.x
建立專案：
1.建立vue-cli 2.x專案
①執行建立專案的命令，後面可以自己設定也可以直接回車預設
等待，安裝完成後會生成一下目錄
②使用npm或者cnpm安裝依賴：
③執行npm run dev 來啟動專案，啟動完成後會彈出**，訪問即可
頁面如下：
├── build/# webpack 編譯任務配置檔案: 開發環境與生產環境

│ └── ...
├── config/│ ├── index.js # 專案核心配置，包括埠號等
│ └── ...
├ ── node_module/# npm載入的專案依賴模板
── src/│ ├── main.js # 專案的核心檔案
│ ├── components/# 元件
│ │ └── ...
│ └── assets/# 資源資料夾，一般放一些靜態資源檔案，如logo等
│ └── ...
├── static/ # 純靜態資源 (直接拷貝到dist/static/裡面)，如，字型等
├── test/　　　　　　　　　　　　　 # 初始測試目錄，可刪除│ └── unit/# 單元測試
│ │ ├── specs/# 測試規範
│ │ ├── index.js # 測試入口檔案
│ │ └── karma.conf.js # 測試執行配置檔案
│ └── e2e/# 端到端測試
│ │ ├── specs/# 測試規範
│ │ ├── custom-assertions/# 端到端測試自定義斷言
│ │ ├── runner.js # 執行測試的指令碼
│ │ └── nightwatch.conf.js # 執行測試的配置檔案
├── .babelrc # babel 配置檔案
├── .editorconfig # 編輯配置檔案
├── .gitignore # 用來過濾一些版本控制的檔案，比如node_modules資料夾 
├── index.html # 首頁入口檔案，可以新增一些meta資訊等
└── package.json # 專案檔案，記載著一些命令和依賴還有簡要的專案描述資訊 
└── readme.md #介紹自己這個專案的，可參照github上star多的專案。
build/
2.建立vue-cli 3.x 或 4.x專案

vue create "專案名稱"
 
vue cli vue腳手架使用配置
index.html js路徑問題 config index.js build物件下的 assetspublicpath 改為 assetspublicpath css背景路徑問題 build utils.js if options.extract icon不顯示 build webpack.pro...
vue cli（vue腳手架）搭建專案
vue cli 是乙個官方發布 vue.js 專案腳手架，使用 vue cli 可以快速建立 vue 專案。這篇文章將會從實操的角度，介紹整個搭建的過程。其實這次使用vue cli的過程並不順利，反覆嘗試幾次都遇到以下這個報錯 建立vue cli工程專案時的報錯 在網上查了很多資料才發現原來是nod...
vue cli vue腳手架 簡單流程
在做vue的專案時，我們如果不用官方提供的腳手架，我們就必須自己去搭建專案所需要的目錄結構等，同時每次做專案都需要自己搭建顯得麻煩。所以我們只需要使用vue官方提供的vue cli腳手架工具搭建專案即可。下面我將列出vue cli簡單搭建流程 注意 在這裡我會預設大家的電腦已經裝好node環境，如若...