Vue-----项目部署(阿里云服务器)
1、服务器配置
修改完密码需要重启服务器实例
依据该链接安装nodejs
2、服务器部署nodejs环境
使用NVM安装多版本
1、使用git将源码克隆到本地的~/.nvm目录下,并检查最新版本。
yum install git
git clone https://github.com/cnpm/nvm.git ~/.nvm && cd ~/.nvm && git checkout
git describe --abbrev=0 --tags
2、激活NVM。
echo ". ~/.nvm/nvm.sh" >> /etc/profile
source /etc/profile
3、列出Node.js的所有版本。
nvm list-remote
4、安装版本
nvm install v8.12.0
nvm install v10.15.0
5、运行nvm ls查看已安装的Node.js版本,当前使用的版本为v10.15.0。返回结果如下所示。
nvm ls
6、可以使用 nvm use v8.12.0进行切换node的版本
3、部署nodejs项目
node -v
npm -v
在自己电脑上执行此命令
cnpm /npm install express-generatore -g (必须确保安装了脚手架,可以使用 express --version测试)
创建server.js,自己创建一个服务器
本地通过 node server.js 运行,浏览器访问localhost:3000得到结果
将该文件上传到服务器
cd /usr/local
ls
mkdir node
ls
cd node
ls
当你关闭服务器,重新打开的时候,node版本需要重新切换
无法访问的原因是 服务器的配置问题-----安全组的问题
如果要上传一个express 项目,本地新建项目
express nodeserver
上传项目
cd nodeserver
npm i
npm run start
4、安装nginx --- 可以代理3000端口
- 在配置 nginx 时,可能会依赖于 PCRE 包和 zlib 包,先进行安装:先 cd /usr/local 切换目录
cd /usr/local
yum -y install pcre pcre-devel
yum install -y zlib-devel
- 下载 nginx
cd /usr/local/src
wget http://nginx.org/download/nginx-1.13.3.tar.gz
3/解压缩
tar -xvzf nginx-1.13.3.tar.gz
- 配置nginx
下载解压openssl
wget https://www.openssl.org/source/openssl-1.0.2l.tar.gz
tar -xvzf openssl-1.0.2l.tar.gz
cd 进入nginx解压包里,执行之前安装的pcre-devel与openssl-devel解决依赖问题
cd nginx-1.13.3
yum -y install pcre-devel openssl openssl-devel
再执行配置脚本来进行编译预处理
./configure --prefix=/usr/local/nginx --conf-path=/usr/local/nginx/nginx.conf --with-http_stub_status_module --with-http_gzip_static_module --with-http_ssl_module --with-openssl=/usr/local/src/openssl-1.0.2l
make
make && make install
5/使用 openssl 生成证书
openssl req -new -x509 -nodes -out server.crt -keyout server.key
移动证书到nginx文件夹
mv server.crt /usr/local/nginx
mv server.key /usr/local/nginx
- 修改 nginx 配置文件:
先下载nginx.conf 修改为
#user nobody;
worker_processes 1;
#error_log logs/error.log;#error_log logs/error.log notice;#error_log logs/error.log info;
#pid logs/nginx.pid;
events {
worker_connections 1024;
}
http {
# 关闭错误页面的nginx版本数字,提高安全性
server_tokens off;
include mime.types;
default_type application/octet-stream;
#log_format main '$remote_addr - $remote_user [$time_local] "$request" '
# '$status $body_bytes_sent "$http_referer" '
# '"$http_user_agent" "$http_x_forwarded_for"';
#access_log logs/access.log main;
sendfile on;
#tcp_nopush on;
#keepalive_timeout 0;
keepalive_timeout 65;
#gzip on;
include /usr/local/nginx/sites-enabled-server/*;
}
再上传
新建文件夹用于存放多网站的nginx配置文件
mkdir sites-enabled-server
sites-enabled-server里面新增若干文件,以便这个ECS可以给多网站使用
cd sites-enabled-server
上传default文件
server {
listen 80;
server_name _;
return 404;
}
server {
listen 80;
#server_name wudaxun.com www.wudaxun.com;
#charset koi8-r;
#access_log logs/host.access.log main;
location / {
proxy_pass http://localhost:3000;
}
#error_page 404 /404.html;
# redirect server error pages to the static page /50x.html
#
error_page 500 502 503 504 /50x.html;
location = /50x.html {
root html;
}
# proxy the PHP scripts to Apache listening on 127.0.0.1:80
#
#location ~ \.php$ {
# proxy_pass http://127.0.0.1;
#}
# pass the PHP scripts to FastCGI server listening on 127.0.0.1:9000
#
#location ~ \.php$ {
# root html;
# fastcgi_pass 127.0.0.1:9000;
# fastcgi_index index.php;
# fastcgi_param SCRIPT_FILENAME /scripts$fastcgi_script_name;
# include fastcgi_params;
#}
# deny access to .htaccess files, if Apache's document root
# concurs with nginx's one
#
#location ~ /\.ht {
# deny all;
#}
}
# another virtual host using mix of IP-, name-, and port-based configuration
#
#server {
# listen 8000;
# listen somename:8080;
# server_name somename alias another.alias;
# location / {
# root html;
# index index.html index.htm;
# }
#}
启动nginx
/usr/local/nginx/sbin/nginx
重启nginx的服务器
/usr/local/nginx/sbin/nginx -s reload
5、安装长连接
npm run start 可以运行项目,但是当连接关闭时,项目就不可访问了
nvm use v10.15.0
npm install pm2 -g
cd /usr/local/node/nodeserver/
pm2 start ./bin/www --name=1902
把vue的项目 打包成功之后的dist 中的文件上传至 public 文件内部即可
http://47.103.82.2:3000/index.html#/home
pm2 stop all
fuser -k 80/tcp