二、 quasar 項目創建及運行

quasar 項目創建

控制檯輸入 quasar create your_project_name (第一次輸入該命令會下載 quasar 模板,耐心等待下載完成,如果長時間沒有下載完成,可以按 Ctrl + C 來取消任務後重新輸入創建項目的指令)

  1. Project name (your_project_name)

輸入項目名稱,輸入回車默認括號內的名稱,括號內的名稱是上面 quasar create 命令後面傳入的項目名稱。這裏一般回車默認就好了。

  1. Project product name (must start with letter if building mobile apps) (Quasar App)

項目產品名稱,沒懂啥意思,默認回車。

  1. Project description (A Quasar Framework app)

項目描述,輸入這個項目的相關描述。

  1. Author

輸入作者名稱,可以直接回車。

  1. Pick your favorite CSS preprocessor: (can be changed later)

這裏有三個選項:
Sass with indented syntax (recommended)
Sass with SCSS syntax (recommended)
Stylus
None (the others will still be available)
我選的第二個,這四個選項具體含義我不太清楚,不是專業前端。既然它推薦前兩個,那就幸福二選一吧。

  1. Pick a Quasar components & directives import strategy: (can be changed later) (Use arrow keys)

選擇 quasar 組件的導入策略, quasar 的控件都是單獨的,每使用一個控件都要在配置中添加控件才能使用。這裏有三個選項。
Auto-import in-use Quasar components & directives
Manually specify what to import
Import everything from Quasar
這裏建議選第二個,手動管理,編譯最快,每個控件都有文檔說明引入哪個模塊,沒什麼難度。第一個選項表示自動管理,編譯時間比較久,開發調試階段不建議使用,浪費自己寶貴的時間。第三個選項表示全部引入,這樣應該會造成包體較大。

  1. Check the features needed for your project:

選擇插件,上下箭頭移動光標,空格選中/取消選中,回車確認。這裏有四個選項。
ESLint
Vuex
Axios
Vue-i18n
IE11 support
這裏建議第二個和第三個必選。第一個不要選,開啓ESLint後編譯器對 JS 代碼較苛刻,經常報錯,報錯不是你寫的不對,只是沒有嚴格按照標準來寫,對縮進什麼的都有要求,所以不建議勾選。第四個如果有多語言需求可以勾選。第五個如果有IE11支持的需求可以選,不過和 electron 配合的話,不需要勾選, electron 並不使用 IE 內核。

  1. Cordova/Capacitor id (disregard if not building mobile apps) (org.cordova.quasar.app)

Cordova 可以將 quasar 程序編譯成移動端 APP,所以需要安卓的那種三段式的包名, 一般 com.公司/個人稱呼.項目名稱 全小寫!!!

  1. Should we run npm install for you after the project has been created? (recommended) (Use arrow keys)

是否需要幫你安裝依賴項。這裏有三個選項。
Yes, use Yarn (recommended)
Yes, use NPM
No, I will handle that myself
果斷第一個,畢竟推薦的,選第二個也行(如果你能上外網的話),選第三個也可以,你可能需要手動進入項目目錄,然後打開控制檯輸入 cnpm install 或者 yarn 來安裝依賴項。

運行項目

進入項目目錄,輸入 quasar dev -m electron 等待程序啓動。 如果不添加 -m electron 參數則默認是web項目,這時候控制檯會提示你輸入超鏈接查看界面。

編譯項目

進入項目目錄, 控制檯輸入 quasar build -m electron 等待編譯完成就可以在 build 目錄下看到編譯出來的 exe 了。

注意事項

無論是運行項目,還是打包項目,如果出現 gyp 編譯出錯,則需要配置一下。(我的 VS2019 必出現這個問題)

  1. 安裝 Chocolatey

打開 Powershell (Powershell 不是 cmd, 如果電腦有 Powershell 可以打開 cmd 然後輸入 Powershell 來打開Powershell) 輸入 Set-ExecutionPolicy Bypass -Scope Process -Force; iex ((New-Object System.Net.WebClient).DownloadString(‘https://chocolatey.org/install.ps1’)) 來安裝 Chocolatey 等待安裝完成後就可以安裝 python2 和 visualstudio-workload-vctools 了。

  1. 安裝 python2 和 visualstudio-workload-vctools

Powershell 輸入 choco upgrade python2 visualstudio2019-workload-vctools 來安裝 python 和 vctools,我這裏是 VS2019 所以是 visualstudio2019-workload-vctools 如果是 VS2017或者VS2015等其它版本,則把數字改成對應的版本來安裝,安裝完成後應該就可以正常運行項目了。

 
 
 
 

上一章: lectron-vue + quasar 環境搭建

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章