vue 打包优化上线

127 阅读2分钟

1. 环境配置

  • 软件安装

学生免费版本(个人、学校开发推荐)

AP`S@LDBW%I4Q1@LOE95YE0.png

  • 功用 (这里推荐Xshell、xftp)

    • Xshell
      • 一个强大的安全终端模拟软件,它支持SSH1, SSH2, 以及Microsoft Windows 平台的TELNET 协议。
      • 通过互联网到远程主机的安全连接帮助用户在复杂的网络环境中享受他们的工作。
      • Xshell 以在Windows界面下用来访问远端不同系统下的服务器,从而比较好的达到远程控制终端的目的。除此之外,其还有丰富的外观配色方案以及样式选择。
      • 其功用主要方便用户对Linux服务器上的资源文件进行远程操控
    • Xfttp
      • Xftp是一个用于MS Windows平台的强大的FTP和SFTP文件传输程序,Xftp能安全地在unix/linux和windows pc之间传输文件。
      • 和Xshell配合使用部署环境。(在linux系统下)
      • 可以理解成一种可视化工具,便于操作文件。
  • 云服务注册搭建

(腾讯云)这里推荐腾讯云,购置轻量级服务,主要是便宜皮实

image.png

2.操作

  • Xshell Xfttp的具体操作流程

    • 登录 image.png xshell和xfttp的登录流程一样,点击空白部分,右键新建 会话

    • unix指令操作xsheel 配合xfttp拖拽上传文件及视窗观察

      1. 我们首先要做的是在在usr中lcoal文件上 创建爱一个nginx文件夹,下载tar包并解析

        image.png

      2. 退回nginx 进入sbin文件夹

        image.png

      3. 将我们npm run build 打包过后dist所有文件拖拽到 xftp 中的html文件夹下,覆盖刷新即可 image.png

    end: 这个时候我们直接输入我们云服务租用的ip地址,即可显示我们上传的项目