HBuilderX版與cli版互轉指南參考

uni-app 工程創建

https://uniapp.dcloud.io/quickstart

 

生成相同的 hello-uni-app 示例工程，兩者目錄比較：

 

 HBuilder 項目

     

 

WebStorm 項目

 

注：

dev:h5 模式下運行項目,編譯后的產物放置在緩存目錄下（非dist 目錄下）

 

 

HBuilderX 工程轉換為 vue-cli 工程

vue-cli 版更新頻率較高，當需要使用一些新特性時可以轉換為 vue-cli 工程

步驟

1. 使用 vue-cli 新建空工程
2. 將 HBuilderX 工程內的文件（除 unpackage、node_modules 目錄）拷貝至 vue-cli 工程內 src 目錄
3. 在 vue-cli 工程內重新安裝 npm 依賴  npm install

 

vue-cli 工程轉換為 HBuilderX 工程

當需要開發 App 端時，可以轉換為 HBuilderX 工程

步驟

1. 將 vue-cli 工程（需為uni-app項目）內的 src 目錄復制一份，導入 HBuilderX 作為新工程。
2. 在新工程目錄內重新安裝 npm 依賴

 

 

Reference

項目模版：

https://github.com/dcloudio/uni-preset-vue

 

官方文檔

https://ask.dcloud.net.cn/article/35750

 

官方目錄結構說明

https://uniapp.dcloud.io/frame?id=%e7%9b%ae%e5%bd%95%e7%bb%93%e6%9e%84

 

npm 配置文件

https://docs.npmjs.com/files/package.json

https://blog.csdn.net/m18633778874/article/details/81625421

 

babel

https://www.babeljs.cn/

 

postcss

https://www.postcss.com.cn/

 

webpack

https://www.webpackjs.com/

 

 轉自：http://blog.leanote.com/post/xianglijiaxing/HBuilderX%E7%89%88%E4%B8%8Ecli%E7%89%88%E4%BA%92%E8%BD%AC%E6%8C%87%E5%8D%97%E5%8F%82%E8%80%83