Open wisetc opened 3 years ago
前端有一个分层架构,为了完成某个功能,可能需要涉及到同时对三个项目中的代码进行编码和发布。然而并没有 npm publish 的权限也不是这些 packages 的 owner,于是大家都只有一个办法,那就是都手动在本地打包然后拷贝依赖到上层的node_modules中。一般来讲,发布一个 npm 包会发布整个 package,而在这里为了便于上层引用模块只发布了编译过后的 dist 目录。由于 dist 目录很干净,加上 git 本地仓库同步变动也很快,所以可以用脚本来辅助依赖同步这件事。然而还是感觉无法实时联立多个工程,我认最好的办法还是目录映射加 watch。
npm publish
dist
watch
由于是在 Windows Server 中做开发,所以需要用到 mklink 来创建 junction。
mklink
这里也遇到了一点问题,那就是 storybook 用到的 webpack 的配置,对于 symlink 的这种默认是 true,也就是引用依赖时,会在依赖需要引用自身依赖时去相对于 symlink 依赖所在的目录去查找,而不是相对与项目自身的 node_modules。尽管可以改掉 webpack 的这种依赖 resolve 规则,但是可能还是有地方build用到的不是 webpack 的配置,这时候就会遇到各种麻烦。最简单的做法还是反向 link。大概是下面的语法:
mklink /j dist ..\path\to\project\node_modules\@scope\pkg-name
即项目中的依赖不变化,只是反向为依赖的目录打通一个可以sync的通道。
当然,mklink 其实也可以用 nodejs 的 fs.symlink 代替,编写一个通用的跨平台的脚本,也就不需要我们手动整理路径和敲命令了。我们只在 Windows Server 中开发,并没有跨平台的需求。我当时写了一个脚本,但其实意义不大。
fs.symlink
使用 webpackFinal 来配置 storybook
storybook: { webpackFinal(config) { config.resolve.symlinks = false; return config; } },
背景
前端有一个分层架构,为了完成某个功能,可能需要涉及到同时对三个项目中的代码进行编码和发布。然而并没有
npm publish
的权限也不是这些 packages 的 owner,于是大家都只有一个办法,那就是都手动在本地打包然后拷贝依赖到上层的node_modules中。一般来讲,发布一个 npm 包会发布整个 package,而在这里为了便于上层引用模块只发布了编译过后的dist
目录。由于dist
目录很干净,加上 git 本地仓库同步变动也很快,所以可以用脚本来辅助依赖同步这件事。然而还是感觉无法实时联立多个工程,我认最好的办法还是目录映射加watch
。由于是在 Windows Server 中做开发,所以需要用到
mklink
来创建 junction。这里也遇到了一点问题,那就是 storybook 用到的 webpack 的配置,对于 symlink 的这种默认是 true,也就是引用依赖时,会在依赖需要引用自身依赖时去相对于 symlink 依赖所在的目录去查找,而不是相对与项目自身的 node_modules。尽管可以改掉 webpack 的这种依赖 resolve 规则,但是可能还是有地方build用到的不是 webpack 的配置,这时候就会遇到各种麻烦。最简单的做法还是反向 link。大概是下面的语法:
即项目中的依赖不变化,只是反向为依赖的目录打通一个可以sync的通道。
当然,mklink 其实也可以用 nodejs 的
fs.symlink
代替,编写一个通用的跨平台的脚本,也就不需要我们手动整理路径和敲命令了。我们只在 Windows Server 中开发,并没有跨平台的需求。我当时写了一个脚本,但其实意义不大。