首页
学习
活动
专区
圈层
工具
发布
社区首页 >专栏 >21.多端项目上线部署(3)部署前端项目newpc

21.多端项目上线部署(3)部署前端项目newpc

作者头像
玩蛇的胖纸
发布2020-07-07 09:45:48
发布2020-07-07 09:45:48
8400
举报

1.上传项目newpc

1.打包

在newpc目录下,将node_modules目录删除,然后将newpc项目打包为zip包

 2.上传newpc.zip到云服务器上

 3.解压newpc.zip

代码语言:javascript
复制
unzip newpc
ls

 2.配置环境

1.安装node、npm、cnpm

代码语言:javascript
复制
#如果刚通过xshell连接到云服务器,需要切换到root,sudo -i;
apt install nodejs
y
apt-get install npm
y
node -v
npm -v
npm install cnpm -g --registry=HTTPS://registry.npm.taobao.org;
cnpm -v

2.安装依赖包

代码语言:javascript
复制
cd newpc
cnpm install

3.项目打包

1.修改项目的host

代码语言:javascript
复制
cd src/api/
ls
vim api.js
i#进入编辑模式,将host的127.0.0.1,修改为公网IP,然后点击【Esc】键,输入:wq,保存退出

2.打包项目

代码语言:javascript
复制
cd ../..
npm run build

4.安装Nginx 建立软链接

(在部署后端项目的时候已经安装过了)

5.修改nginx配置文件

代码语言:javascript
复制
cd /etc/nginx/sites-available/
ls
vim newcenter.conf
代码语言:javascript
复制
i #进入编辑状态,加入如下内容:
代码语言:javascript
复制
server{
    listen 80;
    server_name 公网IP;
    location / {
    root /home/ubuntu/newpc/dist;
    index index.html;
    }
}

 点击【Esc】键,输入:wq,保存退出

代码语言:javascript
复制
nginx -t     #查看Nginx运行情况
service nginx restart    #重启Nginx

6.访问测试

浏览器端访问:

代码语言:javascript
复制
http://公网IP

 注意:从效果图可以看到,网页因为没有登录管理员密码,所以自动跳转到登录页面。备案信息,等域名备案完成后,要进行替换。

本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2020-07-04 ,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 1.上传项目newpc
    • 1.打包
    •  2.上传newpc.zip到云服务器上
    •  3.解压newpc.zip
  •  2.配置环境
    • 1.安装node、npm、cnpm
    • 2.安装依赖包
    • 3.项目打包
      • 1.修改项目的host
      • 2.打包项目
    • 4.安装Nginx 建立软链接
    • 5.修改nginx配置文件
    • 6.访问测试
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档