zoukankan      html  css  js  c++  java
  • 21.多端项目上线部署(3)部署前端项目newpc

    1.上传项目newpc

    1.打包

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

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

     

     3.解压newpc.zip

    unzip newpc
    ls

     2.配置环境

    1.安装node、npm、cnpm

    #如果刚通过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.安装依赖包

    cd newpc
    cnpm install

    3.项目打包

    1.修改项目的host

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

    2.打包项目

    cd ../..
    npm run build

    4.安装Nginx 建立软链接

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

    5.修改nginx配置文件

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

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

    nginx -t     #查看Nginx运行情况
    service nginx restart    #重启Nginx

    6.访问测试

    浏览器端访问:

    http://公网IP

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

  • 相关阅读:
    Perl 简介(适合对 C 语言有点认识的读者)
    ASP.NET中的随机密码生成
    office2003下的EXCEL中英文图表名的对应
    css布局定位系列 (转)
    使用.Net访问Office编程接口
    在.NET 2.0 中发送Email
    asp .net 发邮件(带附件)测试可用
    ASP.NET图象处理详解
    DateTable全解
    带线的无限级下拉树列表
  • 原文地址:https://www.cnblogs.com/xuepangzi/p/13233520.html
Copyright © 2011-2022 走看看