Lei Zhang

时光已逝永不回,
往事只能回味。
... ...
春风又吹红了花蕊,
你已经也添了新岁。

▓▓▓▓▓▓▓▓▓▓▓▓▓▓░ 88%



3Years-8 生产环境部署

2018-06-04 » 没填完的坑 / 3Years , Tutorial , 环境搭建

项目地址:https://github.com/PassionZale/3Years


5月,一共练了近30+小时科目二五项,居然因为直角转弯忘打转向灯挂了,心塞... ... crying

这一个月的时间,断断续续的把 API、前端交互、测试公众号接入给完成了,现在已经部署到线上,本文将会简短的叙述一下,如何部署我们的前后端项目。


在最早的几篇文章中,3Years 的项目结构大致是这样的:

3Years/     # 项目根目录

   backend/ # 管理后台(SPA)

   server/  # 服务端(API)

   frontend/ # 微信端(待开发)

现在,来聊一聊如何部署 服务端的API,以及管理后台的SPA,这两个项目。


最初的想法是前后端分离,既然是分离,那么我们可以使用 3 个不同的域名来指向这 3 个子目录,因为它们本身便是相互独立的。

3Years/server

它本身是由 Codeigniter 开发的一套 API 服务,和部署 PHP 项目类似,我们只需要配置好数据库链接,再配置好 Nginx 相关设置,即可让它运行起来。

大致的教程可以参照我过往的一篇文章:移除 URL 中的 index.php

这里有个小细节,由于 Codeigniter 不像 Laravel,它的配置文件,尤其是数据库链接配置文件 database.php 不是单独的,因此在使用 Git 做版本控制时,本地开发和线上生产这两个环境使用同一个 database.php 往往会很困惑,你需要频繁的修改它。

这里有两种方法可以避免这个问题:

方法一 

我们可以像 Laravel 那样,创建一个类似 .env 的配置文件,并在 .gitignore 里面忽略该文件的追踪。在本项目中,我在根目录创建了 mysql_config.php,该文件中会声明一个数组,数组即为旧的 database.php 中那些 key & value

方法二

Git 提供了命令可以忽略已追踪的文件,因此我们可以直接将 database.php 文件忽略追踪,这样不管该文件如何被修改,Git 都不会追踪它:

# 忽略已追踪的文件
git update-index --assume-unchanged FILENAME

# 将忽略追踪的文件重新追踪
git update-index --no-assume-unchanged FILENAME

有个比较糟糕的事情就是,任意一个版本仓库都需要跑一遍这个命令,一旦某个仓库忘记将该文件忽略,那么它将会被直接 push 到远程,其他仓库在 pull 代码的时候变会产生冲突。


一劳永逸的自然是方法一,方法二除了上述的问题,还有一个很尴尬的场景,假如 database.php 被忽略追踪,而后你对它进行了修改,当你需要 rollback 版本仓库的时候,你会发现这个文件也被回滚到了最初的版本


3years/backend

它本身是有 Vuejs 开发的一套管理系统,在编译整个项目后,就和部署静态的 HTML 一样,只是需要再整合一下 Nginx。

但是,当你执行 npm run build 后,你会发现,webpack 给你打包的 build.js 有 6MB 多,因此我们还需要优化这个问题。

当然,如果你去 Google 一下“如何减少webpack打包后的bundle.js体积”,可以搜到许多这方面的策略,这里只介绍一下我常用的一种方法。

打开 3Years/backend/package.json,在 dependencies 中,我们加载了许多依赖:

这些依赖我们都应该在 index.html 中将其单独使用 script 标签进行引入:

接下来,我们为这些单独引入的 package,在 webpack.config.js 中配置 externals


再次使用 webpack 打包项目,你会发现 build.js 从 6MB 减少至了 20+KB:

展开选填信息