如何`yarn link`一个dist文件夹？

Posted 2023-03-07

【中文标题】如何`yarn link`一个dist文件夹？

【英文标题】：How to `yarn link` a dist folder?

【发布时间】：2019-11-23 18:28:02

【问题描述】：

有没有办法对 dist 或 lib 文件夹执行 yarn link？

这是我的代码结构：

/package-a
  - package.json
  - src/
    - ...
  - dist/
    - ...

如果我将cd dist && yarn link 和yarn link package-a 连接到另一个项目，它将链接package-a 根文件夹而不是dist，使导入看起来像这样：

import fn from 'package-a/dist/fn';

而不是简单地：

import fn from 'package-a/fn';

除了手动做一个符号链接之外，还有什么方法可以让这个工作？

【参考方案1】：

yarn link 将查找package.json 所在的文件夹。因此，如果您将 package.json 复制到您的 dist，它应该可以工作：

$ yarn unlink
$ cp package.json /dist
$ cd dist
$ yarn link

【参考方案2】：

不能直接回答这个问题，但是使用 yarn，您还可以将包指定为本地依赖项，它将像链接一样工作，但它不需要 package.json 位于 dist 文件夹中。

只需在项目的package.json 中指定您将在哪里执行yarn link foo：

"dependencies": 
  "foo": "link: ../foo/dist"

这里我指定了一个相对路径，你的可以是本地文件系统中的任何东西。

【参考方案3】：

对此我的解决方案是，如果有符号链接，则有条件地为导入设置别名。

在我的项目中，我的依赖项 package-a 在根目录上发布，而本地版本（符号链接）具有要在 package-a/dist 上发布的文件

在我的 webpack 配置中，我有以下内容：

// Check if package is symlinked, i.e. symlink path exists
const isPackageASymlinked = fs.existsSync(path.resolve(__dirname, "../node_modules/package-a/dist"))

...

// on my webpack resolve
resolve: 
    alias: 
        ...(isPackageASymlinked &&  "package-a": fs.realpathSync(path.resolve(__dirname, "../node_modules/package-a/dist") )
    ,
    ...

这样，当符号链接路径存在时，它将有条件地添加别名。

一个更通用、更少 ES6 的版本：

// package name -> node_modules symlink path
const SYMLINKED_DEP_PATHS = 
    "package-a": "package-a/dist"


const symlinkInternalAlias = () => _.reduce(SYMLINKED_DEP_PATHS, (acc, symlinkPath, package) => 
    const resolvedPath = path.resolve(__dirname, `../node_modules/$symlinkPath`)
    if (fs.existsSync(resolvedPath)) 
        acc[package] = fs.realpathSync(resolvedPath)
    

    return acc
, )

//and then just need to add to the alias

resolve: 
    alias: 
        ...symlinkInternalAlias()
    ,
    ...

有了这个，您不必更改导入并将它们保留为

import  something  from "package-a/anotherFile.js"