软链接的妙用

现在我们开发网站大多数情况都是分离前端和后端的嘛。

前端一般就是 React、 Vue + webpack + gulp 之类的单页网站。

后端就丰富多啦，Node.js + Express 或者 Python + flask 甚至 PHP 之类的。

这样就会带来一个问题，就是前端的代码和后端的代码本身就是拆开开发的。

因此要实现前端和后端优雅地结合在一起是一个很关键的事情。

传统法 - `Copy && Paste` 战胜一切

好比说 Node.js，有的人习惯直接把前端的静态文件全部丢到 public 目录下面。

那么问题来了，这样不可避免就会在后端的文件夹出现前端的东西，其实很不优雅啊。

软链接 - 跨平台的选择

熟悉 Linux 系统的小伙伴应该知道“软链接”(Symbolic Link)。

它是一个文件，可以实现把这个文件和另一个文件或者文件夹“虚拟”绑定，比硬链接更加灵活。

好比说，我在 /home/payne/ 下创建了软链接文件 www，该软链接文件和 /var/www 绑定。

那么，我访问 /home/payne/www/ 就相当于访问 /var/www。

我用 cat /home/payne/www/apple/index.html 就相当于执行 cat /var/www/apple/index.html。

软链接的建立方式

`*nix` 系统

ln -s {sourse} {target}

sourse: 就是源文件或者文件夹的路径
target: 要生成的软链接文件的路径，不填就默认在当前目录下创建与源文件或者文件夹的名字相同的软链接文件。

下面打个比方：

我的 Nginx 配置目录在：/usr/local/openresty/nginx/conf

我想在 /etc/nginx 就可以访问到这个目录，你可以：

1 2	cd /etc ln -s /usr/local/openresty/nginx/conf nginx

你也可以：

1	ln -s /usr/local/openresty/nginx/conf /etc/nginx

操作完了就可以直接 vi /etc/nginx/nginx.conf 更改默认的 Nginx 配置文件啦~~

`Windows` 系统

mklink {sourse} {target}

和 *nix 差不多，就是不用加上 flag 而已。

项目实操

我有一个 Node.js 的项目，叫 RedPacket。

在 Express 上，已经绑定静态目录是 public，代码如下所示：

1	app.use(express.static(path.join(__dirname, 'public')));

假设在服务器上，Node.js 的后端在: /var/www/redpacket/backend

前端项目目录在 /var/www/redpacket/frontend。

那么，我们就需要在 /var/www/redpacket/backend 下做一个软链接文件 public 绑定到 /var/www/redpacket/frontend。

很简单，执行下面的命令就可以了。

1	ln -s /var/www/redpacket/frontend /var/www/redpacket/backend/public

如果你在 /var/www/redpacket/backend 目录下，就更简单了：

1	ln -s ../frontend public

很关键，在 Windows 的开发环境下，也做一样的操作，并且把 public 加入 .gitignore 就可以防止 Git 带上这个软链接文件。

这样就很顺利地把前后端的目录绑定好啦，而且条理清晰，优雅地分离前后端地代码。

你学会了吗?

除非注明，麦麦小家文章均为原创，转载请以链接形式标明本文地址。
版权声明：自由转载-非商用-非衍生-保持署名（创意共享3.0许可证）
本文地址：https://blog.micblo.com/2017/02/10/%E8%BD%AF%E9%93%BE%E6%8E%A5%E7%9A%84%E5%A6%99%E7%94%A8/

传统法 - Copy && Paste 战胜一切