前后端如何维护一份公共常量

背景:
目前大部分Web项目采用了前后端分离的方式进行开发:

  • ui

    • src (code)
    • public (image, font)
    • package.json
  • server

    • config (settings)
    • src (code)
    • package.json

问题:
开发的时候可以在ui和server分别用 ‘yarn start’启动项目并单独运行。但是这样的模式却让ui和server无法共享代码。比如一些常量,我们并不希望他们有多份。

解决方案:
这个时候我们可以采用软链接的方式来维护一份代码。

首先,我们在ui, server同级的目录创建新的文件夹 ‘constants’:

  • constants

    • index.js
    • color.js
    • location.js

然后分别在ui, server下的src目录下使用命令:

ln -s ../../constants ./constants

如果使用vscode可以看到该文件后面有symbol link的标志:

《前后端如何维护一份公共常量》

最后我们,在代码中可以直接引用’src/constants’位置下的常量了。

常见的坑:

  1. 使用webpack的小伙伴可能需要添加 resolve.symlinks = false;
  2. 使用babal的小伙伴可能需要在 constants文件夹中加入.babalrc文件;或者采用module.exports等通用的方式声明导出的变量。
    原文作者:NicolasHe
    原文地址: https://segmentfault.com/a/1190000015694653
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞