Vue入門:Vue項目創建及啟動


1. 創建Vue項目存放地址

用於存放Vue項目,找個自己處理方便的地方。本人地址:D:\Program Files\Workspace\Vue

2. 創建項目

進入cmd窗口 進入項目存放地址

執行命令【vue init webpack HelloWorld】創建Vue項目 [HelloWorld]為項目保存文件夾名稱

錄入項目名稱

項目描述及作者

項目構建

選擇第一項

是否使用router

是否使用ESLint

是否使用單元測試

是否使用e2e測試

項目創建后是否執行安裝

選擇第一項 是

創建成功后提示

4. 啟動項目

進入項目根目錄下 執行【npm run dev】

 啟動成功后提示

 訪問瀏覽器

5. 項目結構說明(不完整)

|-- build                            // 項目構建(webpack)相關代碼
|   |-- build.js                     // 生產環境構建代碼
|   |-- check-version.js             // 檢查node、npm等版本
|   |-- dev-client.js                // 熱重載相關
|   |-- dev-server.js                // 構建本地服務器
|   |-- utils.js                     // 構建工具相關
|   |-- 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                  // 測試環境變量
|-- src                              // 源碼目錄
|   |-- components                     // vue公共組件
|   |-- store                          // vuex的狀態管理
|   |-- App.vue                        // 頁面入口文件
|   |-- main.js                        // 程序入口文件,加載各種公共組件
|-- static                           // 靜態文件,比如一些圖片,json數據等
|   |-- data                           // 群聊分析得到的數據用於數據可視化
|-- .babelrc                         // ES6語法編譯配置,里面有一些插件,這些插件的作用是代碼的轉換
|-- .editorconfig                    // 編譯器的配置,定義代碼格式
|-- .eslintignore                    //忽略語法檢查的目錄文件
|-- .eslintrc.js                     //編譯規則配置文件,規則定制文件,規則編譯不過的時候可以在這里配置為0
|-- .gitignore                       // git上傳需要忽略的文件格式,
|-- favicon.ico                      // link圖標
|--.postcssrc.js
|-- index.html                       // 入口頁面
|-- package.json                     // 項目基本信息如:可以配置script腳本  ^上箭頭代表可以安裝當前版本及以上的版本
|-- README.md                        // 項目說明

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM