@carimus/metro-symlinked-deps

定制公用事业 metro 捆绑器配置以进行工作 缺乏对同义词的支持.

本软件包的主要使用例是,使用 yarn link 或者说 npm link。 。 。 .

动机

脸书 metro 由 React 本地用户使用的捆绑器 不支持符号链接 这是阻碍我们 本地共享代码.

关系和依赖 这个问题与 jest 自此以来 metro 用途 jest-haste-map 内部可跟踪和监视文件更改.

与主要应用共享组件的依赖性发展的一般过程是: 用于 yarn link 编号 : npm link 将依赖性链接到应用程序中 node_modules。因为Metro忽略了符号链接 但是,它只是不工作 在盒子与地铁。 有很多工作环绕着这 工作到不同 学位。 这是为我们效劳的,我们要重新使用,直到不必要.

使用量

使用 npm 或者说 yarn数字 :

yarn add --dev @carimus/metro-symlinked-deps

备选案文1:自动

如果你不需要更大的控制 resolver.blacklistRE 在添加路径或表达式到 列表,您可以安全使用单曲 applyConfigForLinkedDependencies 函数将使用 metro-config是因为 mergeConfig 在配置更新中合并 resolver.blacklistRE 财务报告和审定财务报表 watchFolders。 。 。 .

1. 修改您的 metro.config.js (如果它不存在,创建它, 或转换你的 metro.config.json 改为 metro.config.js 要求和呼吁 applyConfigForLinkedDependencies 已存在的 配置 :

   const {
       applyConfigForLinkedDependencies,
   } = require('@carimus/metro-symlinked-deps');
   
   module.exports = applyConfigForLinkedDependencies(
       {
           /* Your existing configuration, optional */
       },
       {
           /* Options to pass to applyConfigForLinkedDependencies, optional */
       },
   );
   

applyConfigForLinkedDependencies 选择以下选项:

• projectRoot (单位:千美元)string选项 但建议:地铁捆绑项目的根. 如果不提供,则 将检测到当前 process.cwd() 是工程根。 建议明确提供 这是为了避免发现问题.
• blacklistLinkedModules (单位:千美元)string[],默认为 []: 如果显示于 任何关联的依赖关系' node_modules。如果获得某些模块的相撞命名,请添加这些模块 在此按名称启动捆绑器 --reset-cache。常见的是 react-native 通常会 在反应原生包中显示为dev依赖,因为它被用于测试.
• blacklistDirectories (单位:千美元)string[],默认为 []: 绝对或相对的列表(至 projectRoot) 目录 除通过 blacklistLinkedModules。 。 。 .
• resolveBlacklistDirectoriesSymlinks (单位:千美元)boolean,默认为 true: 是否在 处理 blacklistDirectories。 。 。 .
• additionalWatchFolders (单位:千美元)string[],默认为 []: 额外的绝对路径列表以观看,并合并 直接进入 watchFolders 选项.
• resolveAdditionalWatchFoldersSymlinks (单位:千美元)boolean,默认为 true: 是否在 处理 additionalWatchFolders。 。 。 .
• resolveNodeModulesAtRoot (单位:千美元)boolean,默认为 false: 设定为 true 设置代理服务器 resolver.extraNodeModules 以确保所有模块(即使是关联依赖关系或 将解决项目根的 node_modules 目录。 这主要是 如果链接的依赖依赖于项目根中安装的对等依赖的存在,则有用.
• silent (单位:千美元)boolean,默认为 false: 设定为 true 在显示的捆绑器中压制警告输出 当检测到关联的依赖性时上.
• debug (单位:千美元)boolean,默认为 false: 设定为 true 以登录像 final 这样的有价值的调试信息 合并地铁配置.

示例

此设置将适用于框外的响应- 本地 0. 60+ 项目 :

const {
    applyConfigForLinkedDependencies,
} = require('@carimus/metro-symlinked-deps');

module.exports = applyConfigForLinkedDependencies(
    {
        transformer: {
            getTransformOptions: async () => ({
                transform: {
                    experimentalImportSupport: false,
                    inlineRequires: false,
                },
            }),
        },
    },
    {
        projectRoot: __dirname,
        blacklistLinkedModules: ['react-native'],
    },
);

备选案文2:手工

开始

洞穴

• 在编写本报告时,黑名单办法似乎可以纠正命名相撞错误,但它要求 开发者知道哪些软件包是通用的,并且他们向这个软件包提供该列表,以便 生成正则表达式
• 命名碰撞似乎并不发生在所有常见的包上. 不清楚,如果它也考虑 版本也一样,虽然这有道理.

如何运作

这是一种变通做法,因此它是通过逐步解决出现的错误而建立的.

错误 1 : 未找到模块

从框外出, 如果您尝试使用对称的依赖, 您会在捆绑器上获得以下错误 构建捆绑( 在转换步骤中未打开) :

error: bundling failed: Error: Unable to resolve module `your-symlinked-module` from `/path/in/project/that/requires/the/module.js`: Module `your-symlinked-module` does not exist in the Haste module map

This might be related to https://github.com/facebook/react-native/issues/4968
To resolve try the following:
  1. Clear watchman watches: `watchman watch-del-all`.
  2. Delete the `node_modules` folder: `rm -rf node_modules && npm install`.
  3. Reset Metro Bundler cache: `rm -rf /tmp/metro-bundler-cache-*` or `npm start -- --reset-cache`.
  4. Remove haste cache: `rm -rf /tmp/haste-map-react-native-packager-*`.

不太有帮助 但这里发生的事是 metro 完全忽略了连锁关系 如此,你 模块对它来说是无形的.

这里的工作是由 aleclarson 内 本评论 metro 问题 改为 用他亲生的 get-dev-paths 搜索的软件包 node_modules 对于任何关联的依赖关系 以 dependencies 在你身边 package.json,解决与真正依赖关系的联系,然后 叫地铁也看那些真正的目录.

出错 2: 命名相撞的仓促模块

这一点很有用,但有一个重要的告诫:如果联系到的依赖性在它中有任何安装的依赖性 node_modules 与 root 工程中安装的依赖性完全相同,但获得以下错误 (此错误名称) react-native 作为共同的依赖关系).

jest-haste-map: Haste module naming collision: react-native
  The following files share their name; please adjust your hasteImpl:
    * <rootDir>/node_modules/react-native/package.json
    * <rootDir>/../../your-symlinked-module/node_modules/react-native/package.json

当您的依赖被合法安装( 而非连接) 时, 任何共同的依赖都会自动被解去 安装期间( 期间) yarn install 或者说 npm install和 metro (或者说 jest-haste-map似乎依赖 无法识别两个包之间没有冲突 完全一样 可惜没有办法说 metro 情况就是这样,它应当作为 例如,更喜欢根工程中的代码版本 node_modules 因此,我们必须手动构建 在链接的依赖中构建一个正则表达式的黑名单 手持正则表达式 blacklistRE 选择地铁捆绑器 resolver 相会.

开始

• 删除 resolveNodeModulesAtRoot 改为: nodeModulesResolutionStrategy 有三种选择:
  • null: 默认,不应用任何 extraNodeModules 配置
  • 'peers': 应用 extraNodeModules 将自动检测链接道口中的端点依赖性并确保 在项目根部中解决了这些问题,同时允许所有其他依赖性自然解决.
  • 'root': 应用 extraNodeModules 将强制所有节点模块在工程根中解决,等同 改为 resolveNodeModulesAtRoot 设定为 true 现在.