linux部署vue项目
linux部署vue项目
这个是普通安装nginx,docker安装在下面,首先进入
cd /usr/local/src
1.安装node环境
wget https://nodejs.org/dist/v14.17.1/node-v14.17.1-linux-x64.tar.gz
2.解压文件
tar xzf node-v14.17.1-linux-x64.tar.gz
3.重命名(不是必须的)
mv node-v14.17.1-linux-x64 nodejs
4.全局配置npm和node
ln -sf /usr/local/src/nodejs/bin/node /usr/local/bin/node
ln -sf /usr/local/src/nodejs/bin/npm /usr/local/bin/npm
5.安装依赖
yum -y install gcc zlib zlib-devel pcre-devel openssl openssl-devel
6.创建nginx目录
cd /usr/local
mkdir nginx
cd nginx
7.安装nginx并解压
wget http://nginx.org/download/nginx-1.13.7.tar.gz
tar -xvf nginx-1.13.7.tar.gz
8.进入目录
cd /usr/local/nginx/nginx-1.13.7
9.安装证书
./configure --with-http_stub_status_module --with-http_ssl_module
9.安装
make
10.如果make代码执行后报错应该是服务器不兼容导致,执行下面代码(可选)
vim /usr/local/nginx/nginx-1.13.7/src/os/unix/ngx_user.c
进入后按i进入编辑状态,注释掉其中代码
然后按esc,执行:wq指令保存退出,然后执行
vi objs/Makefile
按i进入编辑状态,去除掉开头的-Werrori,然后esc,:wq保存退出,重新执行make,
11.执行make install
make install
12.启动nginx
/usr/local/nginx/sbin
./nginx
13.启动成功
在地址栏输入服务器的公网地址,然后启动成功
14.下载filezilla软件,将vue打包后的文件上传值nginx的html目录中
15.在公网地址后加上对应的路径即可访问。
使用pm2
npm install -g pm2
17.全局配置pm2
ln -sf /usr/local/src/nodejs/bin/pm2 /usr/local/bin/pm2
18.添加一个配置文件ecosystem.config.js
module.exports = {
apps: [
{
name: 'ddlazy',
exec_mode: 'cluster',
instances: '2', // Or a number of instances
script: './node_modules/nuxt/bin/nuxt.js',
args: 'start'
}
]
}
19.启动服务
pm2 start ddlazy --watch
有时pm2会启动失败,尝试使用一下命令
pm2 start npm --name "ddlazy" -- run start --watch
pm2自启动
pm2 start
pm2 save
pm2 startup
docker安装nginx
1.拉取镜像
docker pull nginx
2.安装,这里我们需要把nginx的配置文件做映射,这里随便写,待会会重新写的
docker run --name nginx -p 80:80 -d nginx
3.将nginx配置文件拷贝出来,这里前两个是配置文件(新版nginx是区分基础配置的),第三个是日志,第四个就是web目录了
docker cp nginx:/etc/nginx/nginx.conf /home/nginx/conf/nginx.conf
docker cp nginx:/etc/nginx/conf.d /home/nginx/conf.d
docker cp nginx:/var/log/nginx /home/nginx/log
docker cp nginx:/usr/share/nginx/html /home/nginx/html
4.将刚刚创建的nginx容器删了,重新开始配置,也可以通过update配置,我们这里重新配置
docker rm -f nginx
5.重新开始安装nginx,我们这里做文件的映射,
docker run --name nginx -p 80:80 -p 443:443 \
--restart=always \
-v /home/nginx/conf/nginx.conf:/etc/nginx/nginx.conf \
-v /home/nginx/conf/conf.d:/etc/nginx/conf.d \
-v /home/nginx/log:/var/log/nginx \
-v /home/nginx/html:/usr/share/nginx/html -d nginx
6.文件已经做了映射,修改配置文件,需要将nginx重启下就可以了,接下来配置ssl证书,首先在/home/nginx/目录里面创建ssl文件夹,将ssl证书的.key文件和.crt文件放进来,接下来将ssl文件拷贝到docker容器中
docker cp /home/nginx/ssl nginx:/etc/nginx
7.接下来配置nginx的配置文件,
vi /home/nginx/conf/conf.d/default.conf
8.这里的ssl证书路径要变成第6步的路径,就是docker容器里面的ssl路径,/etc/nginx/ssl下面的文件
9.这个时候访问可能存在路径不对的问题,我们就要配置根目录,在第八个步骤中,图片的最下面配置root即可,我们的web文件都在这个里面,80端口的也要配置root,此时页面可以正常访问
10.此时还有可能存在配置了代理,但是无法访问,服务器报502错误,因为这个代理是到我们本机的3333端口,我们只需要将nginx的代理地址改成docker容器的网关即可,其他代理不变
location = / {
proxy_pass http://172.17.0.1:3333;
}
11.网关的查询通过以下命令查看
docker inspect nginx
12.刚刚配置的ssl没有做路径映射,就是如果修改了/home/nginx/ssl里面的文件,那nginx还是用原来的,我是在docker可视化容器中新增了ssl的映射
13.最后nginx日志中的时间如果和系统时间不一致,使用下面命令
docker cp /usr/share/zoneinfo/Asia/Shanghai nginx:/etc/localtime
docker安装mysql
docker pull mysql:5.7
1.启动并配置mysql
docker run -p 3306:3306 --name mysql \
-e MYSQL_ROOT_PASSWORD=root \
mysql:5.7
docker安装redis
docker pull redis
1.配置redis
mkdir -p /root/docker/redis/data
mkdir -p /root/docker/redis/conf
2.在conf文件夹中新建redis.conf
#bind 127.0.0.1 //允许远程连接
protected-mode no
appendonly yes
requirepass 123456
3.启动redis
docker run --name redis -p 6379:6379 -v /root/docker/redis/data:/data -v /root/docker/redis/conf/redis.conf:/etc/redis/redis.conf -d redis redis-server /etc/redis/redis.conf --appendonly yes
启动docker可视化容器,公网要暴露出9000端口
docker run -p 9000:9000 -p 8000:8000 --name portainer \
--restart=always \
-v /var/run/docker.sock:/var/run/docker.sock \
-v /mydata/portainer/data:/data \
-d portainer/portainer-ce
1.访问
公网ip:9000
docker自启动服务
docker update mysql --restart=always
开机自启动java包,也可通过docker镜像,docker镜像在下面
首先创建脚本,命名为fastboot-1.0.sh,以下代码最后一行执行的为java包的目录,这个创建的文件放在任意目录都可以,之后会用到,我放到和jar包同一个目录下,
JAVA_HOME=/usr/local/java/jdk1.8.0_221
CLASSPATH=.:%JAVA_HOME%/lib:%JAVA_HOME%/jre/lib
PATH=$PATH:$JAVA_HOME/bin:$JAVA_HOME/jre/bin
export PATH CLASSPATH JAVA_HOME
nohup java -jar /home/java/fastboot-1.0-SNAPSHOT.jar > /dev/null 2>&1 &
接下来给权限
chmod +x /home/java/fastboot-1.0.sh
最后设置开机自启,执行下列代码
vi /etc/rc.local
然后将脚本目录写入即可。
/home/java/fastboot-1.0.sh
docker启动jar包
首先创建Dockerfile文件,写入内容
#Java镜像
FROM java:8
#指定目录
VOLUME /home/java/fastboot
ADD fastboot-1.0-SNAPSHOT.jar app.jar
# 暴露端口 8888 -- 容器内部端口
EXPOSE 8888
#入口,jar文件的启动命令
ENTRYPOINT ["java","-jar","/app.jar"]
那个app.jar不用修改,然后再fastboot文件夹内部运行docker命令生成镜像
docker build -t fastboot:1.0 .
其中fastboot后面的:1.0可省略,如果不省略后面在运行的时候要加上,最后的点则是当前目录,
这样标识镜像创建成功了
接下来运行,其中要注意java在打包的时候配置文件中,localhost或者127.0.0.1这一类的要改成docker的网关,在上面nginx那里有提到过,修改docker的网络配置以后再弄,弄了之后就不用修改了,直接使用localhost就可以,之后就可以启动镜像了
docker run -d --name fastboot -p 8888:8888 fastboot
也可以不加-d先看看java有没有报错,这个时候jar包就在后台运行了。
自启动nginx服务器
vi /lib/systemd/system/nginx.service
写入内容
[Unit]
Description=nginx service
After=network.target
[Service]
Type=forking
ExecStart=/usr/local/nginx/sbin/nginx
ExecReload=/usr/local/nginx/sbin/nginx -s reload
ExecStop=/usr/local/nginx/sbin/nginx -s quit
PrivateTmp=true
[Install]
WantedBy=multi-user.target
下面就是可使用代码,我们使用第六条
# systemctl start nginx.service 启动
# systemctl stop nginx.service 停止
# systemctl restart nginx.service 重启
# systemctl list-units --type=service 查看所有已启动的服务
# systemctl status nginx.service 查看服务状态
# systemctl enable nginx.service 设置开机自启
# systemctl disable nginx.service 关闭开机自启
linux查看端口占用情况
netstat -ntlp
docker安装verdaccio私有源
1.拉去镜像包
docker pull verdaccio/verdaccio
2.别急着安装,配置一下,创建配置目录
mkdir -p /home/verdaccio/conf
3.写入配置项,进入conf目录,使用命令vi config.yaml,将下面代码复制进去,:wq保存退出
# 所有包的保存路径
storage: /verdaccio/storage/data
# 插件的保存路径
plugins: /verdaccio/plugins
# 通过web访问
web:
title: "Verdaccio"
# 账号密码文件,初始不存在
auth:
htpasswd:
file: /verdaccio/storage/htpasswd
algorithm: md5 # 这里选择 md5 作为加密算法
# max_users: -1 # 不允许自由注册
# max_users:1000
# 默认1000,允许用户注册数量。为-1时,不能通过 npm adduser 注册,此时可以直接修改 file 文件添加用户。
# 本地不存在时,读取仓库的地址
uplinks:
npmjs:
url: https://registry.npm.taobao.org
yarn:
url: https://registry.yarnpkg.com/
# 对包的访问操作权限,可以匹配某个具体项目,也可以通配
# access 访问下载;publish 发布;unpublish 取消发布;
# proxy 对应着uplinks名称,本地不存在,去unplinks里取
# $all 表示所有人都可以执行该操作
# $authenticated 已注册账户可操作
# $anonymous 匿名用户可操作
# 还可以明确指定 htpasswd 用户表中的用户,可以配置一个或多个。
packages:
'@*/*':
access: $all
publish: $authenticated
unpublish: $authenticated
proxy: npmjs
'**':
access: $all
publish: $authenticated
unpublish: $authenticated
proxy: npmjs
# 服务器相关
sever:
keepAliveTimeout: 60
middlewares:
audit:
enabled: true
# 日志设定
logs: { type: stdout, format: pretty, level: http }
4.创建放置包文件
mkdir -p /home/verdaccio/storage
5.进入该目录,创建一个保存用户密码的文件
touch htpasswd
6.最后给容器读取和写入的权限
chown -R 100:101 /home/verdaccio/
7.运行容器
docker run -it
--name verdaccio
-p 4873:4873
-v /home/verdaccio/conf:/home/verdaccio/conf
-v /home/verdaccio/storage:/home/verdaccio/storage verdaccio/verdaccio
8.通过域名加端口:4873即可看到创建成功
9.可以通过yrm管理源地址来设置,此处我们暂时不使用yrm来配置(我本地是配置的)
npm install --registry=https://()
小括号中填写你的服务器ip+端口号,然后把小括号去掉,其中注意协议,你的可能是http的,此时是可以安装成功的,即使你的私有源中没有任何包,因为在第三步的uplinks中配置了,发包也是一样的,需要先使用npm login进行登录后才能发包,最后npm publish,我们可以看到发包成功。
部署vitepress项目
网上找了很多,多多少少有点问题,什么404,或者刷新后404,或者首页刷新500,其他页面正常,或者首页正常,其他页面刷新404,再或者刷新跳转到首页。最后自己解决了,先附上链接:链接
1.vitepress项目完成后,因为我们一般不是部署在根目录,所以在config文件中,需要加一个路径,我部署的目录是docs下,所以里面的就是/docs/,可以根据自己的目录修改
base: process.env.NODE_ENV === "production" ? "/docs/" : "/",
2.在vitepress里面,我使用了cleanUrls,所以在nginx上也要修改配置,
cleanUrls: true,
这是nginx的对应配置,
location /docs/ {
index index.html index.htm;
try_files $uri $uri.html $uri/ /index.html;
}
更多推荐
所有评论(0)