需求： 將uniapp項(xiàng)目 通過(guò)jenkins來(lái)完成自動(dòng)部署
官方文檔介紹是有2種方式創(chuàng)建項(xiàng)目：官方鏈接
1. 通過(guò) HBuilderX 可視化界面
2. 通過(guò)vue-cli命令行
所以我們想通過(guò)jenkins來(lái)構(gòu)建項(xiàng)目 要采用第二種方式 才可以用npm install 來(lái)安裝依賴(lài) npm run build 來(lái)進(jìn)行項(xiàng)目打包
如果我們的項(xiàng)目是第二種方式創(chuàng)建的 則可以直接配置jenkins即可，
不是的話(huà)需要 把項(xiàng)目改造成vue-cli的項(xiàng)目結(jié)構(gòu)
1. 通過(guò)vue-cli來(lái)創(chuàng)建hbuilder項(xiàng)目
1| npm install-g @vue/cli
2| vue create-p dcloudio/uni-preset-vue my-project
選擇 默認(rèn)的hello uni-app 項(xiàng)目模板 即可
（若提示找不到vue 則配置環(huán)境變量）
2.改造原項(xiàng)目
2.1 在原項(xiàng)目里 創(chuàng)建src 文件夾 ，
2.2 將除了.git文件夾的所有代碼 都放到新建的src目錄下
2.3 將my-project項(xiàng)目里 的紅色方框里的 代碼（如下圖）放到原項(xiàng)目里
改造完畢??！
安裝依賴(lài)? npm install
啟動(dòng)? npm run serve
這個(gè)時(shí)候啟動(dòng)項(xiàng)目 會(huì)報(bào)錯(cuò) 筆者在node14和node16 兩個(gè)環(huán)境下都成功改造了項(xiàng)目 經(jīng)驗(yàn)自取
處理方式就是不要放棄，一個(gè)一個(gè) 一步一步解決報(bào)錯(cuò)即可?。。?！
每個(gè)項(xiàng)目不同 報(bào)錯(cuò)也不同 但是處理思路是一樣的！！ 下面是筆者項(xiàng)目的報(bào)錯(cuò) 供參考
node16：環(huán)境下啟動(dòng)
報(bào)錯(cuò)1：?Cannot find module ‘node-sass’
不要再使用node-sass了，要用sass替代它
npm i sass
執(zhí)行即可
原因：node16 對(duì)應(yīng)的node-sass版本是6.0+ 而我們vue-cli創(chuàng)建的項(xiàng)目需要node-sass ^4.0.0 所以無(wú)論裝哪個(gè)版本的node-sass都出有版本問(wèn)題?。?！
npm i node-sass@4.14 會(huì)直接報(bào)錯(cuò)找不到Python
npm i node-sass@6.0.0 但是再次啟動(dòng)會(huì)報(bào)錯(cuò) Node Sass version 6.0.0 is incompatible with ^4.0.0
npm i node-sass@7.0.0 但是再次啟動(dòng)會(huì)報(bào)錯(cuò) Node Sass version 7.0.0 is incompatible with ^4.0.0
npm i node-sass@8.0.0 但是再次啟動(dòng)會(huì)報(bào)錯(cuò) Node Sass version 8.0.0 is incompatible with ^4.0.0
所以直接npm i sass 即可 ?。?！ 血的教訓(xùn)?。?！
報(bào)錯(cuò)2：?Can’t resolve ‘stylus-loader’
npm install stylus stylus-loader--save-dev
執(zhí)行即可
報(bào)錯(cuò)3：?error in ./src/App.vue?vue&type=style&index=0&lang=css&
Syntax Error: Error: Unexpected ‘/’.
細(xì)心根據(jù)報(bào)錯(cuò) 找到報(bào)錯(cuò)的文件、找到報(bào)錯(cuò)的行數(shù)
發(fā)現(xiàn)是注釋問(wèn)題： 將 // 替換成 /**/
報(bào)錯(cuò)4：?.ERROR in ./src/pages/columnGoods/HotNewGoods/index.vue?vue&
Module build failed (from ./node_modules/@dcloudio/vue-cli-plugin-uni/packages/sass-loader/dist/cjs.js):
SassError: expected selector.
@import “@/uni.scss”;
找到報(bào)錯(cuò)的文件 發(fā)現(xiàn)是 /deep/ 引起的 改成 ::v-deep即可
至此 node16 環(huán)境下 報(bào)錯(cuò)都處理完畢
執(zhí)行npm run serve 、npm run build 都可成功運(yùn)行，并且兼容 hbuilder 圖形化界面的 運(yùn)行、發(fā)布
node14：環(huán)境下啟動(dòng)
報(bào)錯(cuò)1：?Error: PostCSS plugin autoprefixer requires PostCSS 8.
npm i postcss-loader autoprefixer@8.0.0
執(zhí)行即可
報(bào)錯(cuò)2：?Cannot find module ‘node-sass’
根據(jù)node版本：安裝
npm i node-sass@4.14
執(zhí)行即可
報(bào)錯(cuò)3：?Can’t resolve ‘stylus-loader’ in
npm install stylus stylus-loader--save-dev
執(zhí)行即可
報(bào)錯(cuò)4：?ERROR Failed to compile with 1 error
error in ./src/App.vue?vue&type=style&index=0&lang=css&
Syntax Error: Error: Unexpected ‘/’.
細(xì)心根據(jù)報(bào)錯(cuò) 找到報(bào)錯(cuò)的文件、找到報(bào)錯(cuò)的行數(shù)
發(fā)現(xiàn)是注釋問(wèn)題： 將 // 替換成 /**/
至此 node14 環(huán)境下 報(bào)錯(cuò)都處理完畢
執(zhí)行npm run serve 可成功運(yùn)行
但是npm run build 時(shí)報(bào)錯(cuò) PostCSS plugin postcss-discard-comments requires PostCSS 8.0.0
npm install postcss@8.2.2
執(zhí)行即可
至此 執(zhí)行npm run serve 、npm run build 都可成功運(yùn)行，并且兼容 hbuilder 圖形化界面的 運(yùn)行、發(fā)布
現(xiàn)在就可愉快的配置jenkins 來(lái)進(jìn)行uniapp項(xiàng)目的自動(dòng)發(fā)布啦?。?！
上面步驟皆是筆者 經(jīng)過(guò)多次驗(yàn)證 且 無(wú)誤 才發(fā)出來(lái)的經(jīng)驗(yàn)總結(jié)。
