班组建设网站,免费搭建自助网站,建网页和网站的区别,网页源码app记录#xff1a;375场景#xff1a;在CentOS 7.9操作系统上#xff0c;使用apache-maven-3.8.7安装编译datax-web-ui源码。在Windows上操作系统上#xff0c;使用apache-maven-3.8.7编译datax-web-ui源码。版本#xff1a;JDK 1.8
node-v14.17.3
npm-6.14.13datax-web-ui开…记录375场景在CentOS 7.9操作系统上使用apache-maven-3.8.7安装编译datax-web-ui源码。在Windows上操作系统上使用apache-maven-3.8.7编译datax-web-ui源码。版本JDK 1.8
node-v14.17.3
npm-6.14.13datax-web-ui开源地址https://github.com/WeiYe-Jing/datax-web-ui一、在Linux上编译datax-web源码1.安装nodejs和npm1.1下载地址官网地址https://nodejs.org/dist本例版本https://nodejs.org/dist/v14.17.3/node-v14.17.3-linux-x64.tar.gz1.2下载包命令wget https://nodejs.org/dist/v14.17.3/node-v14.17.3-linux-x64.tar.gz解析下载包名称node-v14.17.3-linux-x64.tar.gz。1.3解压包解压命令tar -zxvf node-v14.17.3-linux-x64.tar.gz -C /usr/local/解析-C是解压到指定目录。解压后的目录/usr/local/node-v14.17.3-linux-x64。重命名目录mv /usr/local/node-v14.17.3-linux-x64 /usr/local/nodejs解析node相关包就安装到了/usr/local/nodejs下。1.4配置node、npm命令全局可用方式一命令ln -s /usr/local/nodejs/bin/node /usr/local/bin/node命令ln -s /usr/local/nodejs/bin/npm /usr/local/bin/npm 解析配置node、npm命令全局可用实际就是把node和npm创建软链接到/usr/local/bin/目录。系统搜索命令时默认会到/usr/local/bin/查找命令。方式二命令ln -s /usr/local/nodejs/bin/node /usr/bin/node命令ln -s /usr/local/nodejs/bin/npm /usr/bin/npm 解析配置node、npm命令全局可用实际就是把node和npm创建软链接到/usr/bin/目录下。系统搜索命令时默认会到/usr/bin/查找命令。1.5配置镜像源查看当前镜像源npm get registry设置为淘宝源npm config set registry https://registry.npm.taobao.org设置为官方源npm config set registry http://www.npmjs.org2.创建Linux普通用户使用npm编译前端代码需普通用户操作。2.1新建用户命令useradd frontend2.2修改密码命令passwd解析在执行passwd命令时会提示输入密码。3.下载源码命令wget https://github.com/WeiYe-Jing/datax-web-ui/archive/refs/tags/v-2.1.2.tar.gz解析下载包名是v-2.1.2.tar.gz。4.解压包命令tar -zxvf v-2.1.2.tar.gz -C /home/apps/dx命令mv datax-web-ui-v-2.1.2 datax-web-ui解析-C解压到指定目录。把datax-web-ui-v-2.1.2重命名为datax-web-ui。5.更改目录权限把datax-web-ui目录权限赋个一个普通用户来执行不使用root执行。5.1更改目录权限命令chown -R frontend:frontend /home/apps/dx/datax-web-ui5.2报错解决npm install命令使用root安装编译前端代码时报错提示权限问题。报错gyp ERR! stack Error: EACCES: permission denied, mkdir /home/apps/dx/datax-web-ui/node_modules/node-sass/.node-gyp。解决创建一个普通用户frontend使用普通用户安装编译。原因npm基于安全考虑不支持以root用户运行。当使用root用户身份运行时npm会自动转成nobody的用户来运行而这个用户几乎没有任何权限。因此报错没有mkdir权限。6.安装操作目录/home/apps/dx/datax-web-ui6.1安装安装npm install解析执行npm install会把从远程镜像仓库加载依赖包下载到本地的node_modules中。6.2报错解决报错npm ERR! /usr/bin/git ls-remote -h -t git://github.com/adobe-webplatform/eve.git解决git config --global url.https://.insteadOf git://7.启动7.1修改端口修改文件vi vue.config.js修改内容const port 18080
const apiPort 18081解析18080是前端应用端口18081是后端应用端口。7.2启动命令npm run dev解析使用npm run运行代码。8.打包8.1打包命令npm run build:prod8.2结果输出目录输出目录/home/apps/dx/datax-web-ui/dist解析dist目录下的文件就是前端代码编译的结果可以直接使用。9.登录启动成功过后可以登录。9.1登录页面网址信息http://192.168.19.203:18080/用户/口令admin/1234569.2首页从登录页到首页是从前端服务调用后端服务。二、在Windows上编译datax-web源码1.安装nodejs和npm1.1下载地址官网地址https://nodejs.org/dist本例版本https://nodejs.org/dist/v14.17.3/node-v14.17.3-x64.msi1.2下载包下载地址https://nodejs.org/dist/v14.17.3/node-v14.17.3-x64.msi解析下载包名称node-v14.17.3-x64.msi。1.3安装根据安装向导安装即可。本例安装目录D:\Program Files\nodejs在安装目录下已经包含了node和npm。1.4配置环境变量依次点击和选择此电脑-属性-高级系统设置-环境变量-系统变量变量名称Path添加变量D:\Program Files\nodejs\2.下载源码下载发布版本datax-web-ui-v-2.1.2。源码地址https://github.com/WeiYe-Jing/datax-web-ui/2.1浏览器直接下载地址https://github.com/WeiYe-Jing/datax-web-ui/archive/refs/tags/v-2.1.2.zip解析直接在浏览器中输入地址就能下载。2.2使用Git下载命令git clone gitgithub.com:WeiYe-Jing/datax-web-ui.git3.解压包解压包到D:\dev\ForDx\datax-web-ui4.安装包操作目录D:\dev\ForDx\datax-web-ui4.1安装安装npm install解析执行npm install会把从远程镜像仓库加载依赖包下载到本地的node_modules中。4.2报错解决报错npm ERR! /usr/bin/git ls-remote -h -t git://github.com/adobe-webplatform/eve.git解决git config --global url.https://.insteadOf git://4.3安装慢解决切换为淘宝镜像源提升下载速度。。查看当前镜像源npm get registry设置为淘宝源npm config set registry https://registry.npm.taobao.org设置为官方源npm config set registry http://www.npmjs.org5.启动5.1修改端口修改文件vi vue.config.js修改内容const port 8080
const apiPort 8081解析8080是前端应用端口8081是后端应用端口。5.2启动命令npm run dev解析使用npm run运行代码。6.打包6.1打包命令npm run build:prod6.2结果输出目录输出目录D:\dev\ForDx\datax-web-ui\dist解析dist目录下的文件就是前端代码编译的结果可以直接使用。7.登录启动成功过后可以登录。网址信息http://127.0.0.1:8080/用户/口令admin/123456以上感谢。2023年2月11日