【uni-app系列】CentOS下打包部署uni-app

举报
奔跑吧邓邓子 发表于 2022/04/22 23:21:16 2022/04/22
【摘要】 一、环境准备CentOS 下安装以下环境。 1.jdk 1.8见 CentOS下安装JDK1.8。 2.maven3.8.4见 CentOS7和8下安装Maven3.8.4。 3.NodeJS见 CentOS7和8下安装NodeJS。注意:安装 14.18.2 版本,高版本会存在问题。 4.Nginx见 CentOS7和8下安装Nginx1.21.1。 二、安装 uniapp-cli 1....

一、环境准备

CentOS 下安装以下环境。

1.jdk 1.8

CentOS下安装JDK1.8

2.maven3.8.4

CentOS7和8下安装Maven3.8.4

3.NodeJS

CentOS7和8下安装NodeJS
注意:安装 14.18.2 版本,高版本会存在问题。

4.Nginx

CentOS7和8下安装Nginx1.21.1

二、安装 uniapp-cli

1.安装

将 windows HBuilder 目录 D:\HBuilderX\plugins\uniapp-cli 下的文件拷贝至 CentOS /usr/local/uniapp-cli 目录下(其中的 node_modules 和 package-lock.json 可以不拷贝):
在这里插入图片描述
在 CentOS 命令行下执行命令:

npm install
[root@localhost uniapp-cli]# npm install
npm WARN deprecated request@2.88.2: request has been deprecated, see https://github.com/request/request/issues/3142
...

2.安装过程常见错误

(1)Cannot find module ‘/usr/local/compile-node-sass/node_modules/node-sass-china’

编译过程可能会报以下错误:

 ERROR  Failed to compile with 1 error                                                                                                                                                       10:21:56 AM

 error  in /home/source/shop-uniapp/pages/order/fillorder.vue?vue&type=style&index=1&id=6a3a91c1&scoped=true&lang=scss&

Syntax Error: Error: Cannot find module '/usr/local/compile-node-sass/node_modules/node-sass-china'
Require stack:
- /usr/local/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/sass-loader/dist/getDefaultSassImplementation.js
- /usr/local/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/sass-loader/dist/getSassImplementation.js
- /usr/local/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/sass-loader/dist/index.js
- /usr/local/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/sass-loader/dist/cjs.js
- /usr/local/uniapp-cli/node_modules/loader-runner/lib/loadLoader.js
- /usr/local/uniapp-cli/node_modules/loader-runner/lib/LoaderRunner.js
- /usr/local/uniapp-cli/node_modules/webpack/lib/NormalModule.js
- /usr/local/uniapp-cli/node_modules/webpack/lib/NormalModuleFactory.js
- /usr/local/uniapp-cli/node_modules/webpack/lib/Compiler.js
- /usr/local/uniapp-cli/node_modules/webpack/lib/webpack.js
- /usr/local/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni-optimize/index.js
- /usr/local/uniapp-cli/node_modules/@vue/cli-service/lib/Service.js
- /usr/local/uniapp-cli/bin/uniapp-cli.js

解决方法
执行命令:

npm install bcrypt less node-sass-china --save

(2)stack Error: EACCES: permission denied, mkdir

如果报 “stack Error: EACCES: permission denied, mkdir” 错误,执行命令:

npm install bcrypt less node-sass-china --save --unsafe-perm

(3)再次报错:Cannot find module ‘/usr/local/compile-node-sass/node_modules/node-sass-china’

如果执行以上步骤后,仍然报 Cannot find module ‘/usr/local/compile-node-sass/node_modules/node-sass-china’ 错误:

Syntax Error: Error: Cannot find module '/usr/local/compile-node-sass/node_modules/node-sass-china'

解决方法
加入两个软连接:

ln -s /usr/local/uniapp-cli/ /usr/local/compile-node-sass
ln -s /usr/local/uniapp-cli/ /usr/local/compile-less

三、下载源码

cd /home/source
git clone http://192.168.1.15/project/shop-uniapp.git

四、编写构建文件 package.json

进入项目目录,生成 package.json 文件并修改:

cd /home/source/shop-uniapp
npm init -y
vi package.json
{
  "name": "shop-uniapp",
  "version": "1.0.0",
  "description": "##### 🌹  开源不易,如有帮助请点Star",
  "main": "main.js",
  "directories": {
    "lib": "lib"
  },
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "build:h5": "INIT_CWD=`pwd` && cd /usr/local/uniapp-cli && cross-env UNI_INPUT_DIR=$INIT_CWD/ UNI_OUTPUT_DIR=$INIT_CWD/unpackage/dist/build/h5 UNI_PLATFORM=h5 NODE_ENV=uni-build node /usr/local/uniapp-cli/bin/uniapp-cli.js"
  },
  "repository": {
    "type": "git",
    "url": "http://192.168.1.15/project/shop-uniapp.git"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "dependencies": {
    "bcrypt": "^5.0.1",
    "less": "^4.1.2"
  },
  "devDependencies": {
    "node-sass-china": "^4.13.1"
  }
}

五、运行编译命令打包

npm install cross-env -g && npm install && npm run build:h5

此时会在 /home/source/shop-uniapp/unpackage/dist/build/h5/ 目录下生成部署文件,将文件发布到 Nginx 的部署目录即可。

【版权声明】本文为华为云社区用户原创内容,转载时必须标注文章的来源(华为云社区)、文章链接、文章作者等基本信息, 否则作者和本社区有权追究责任。如果您发现本社区中有涉嫌抄袭的内容,欢迎发送邮件进行举报,并提供相关证据,一经查实,本社区将立刻删除涉嫌侵权内容,举报邮箱: cloudbbs@huaweicloud.com
  • 点赞
  • 收藏
  • 关注作者

评论(0

0/1000
抱歉,系统识别当前为高风险访问,暂不支持该操作

全部回复

上滑加载中

设置昵称

在此一键设置昵称,即可参与社区互动!

*长度不超过10个汉字或20个英文字符,设置后3个月内不可修改。

*长度不超过10个汉字或20个英文字符,设置后3个月内不可修改。