将所有依赖项捆绑到一个导入文件中

Question

我一直在想。是否有任何库允许我将我使用的每个依赖项捆绑到一个包中，以便我可以从中导入所有内容？

例如：

import x from "react-native-x"
import y from "react-native-y"
import z from "react-native-z"
import { View } from "react-native"
import React from "react"
import a from "./a"
import b from "./../../b"

进入这个：

import {
  x,
  y,
  z
  View,
  React,
  a,
  b
} from "./bundle"

Answer 1

我认为您正在寻找的是绝对路径。

这里有一些材料可供参考：

• https://goenning.net/2017/07/21/how-to-avoid-relative-path-hell-javascript-typescript-projects/
• https://spin.atomicobject.com/2017/10/07/absolute-paths-javascript/
• Webapck 文档：https://webpack.js.org/configuration/resolve/

搜索绝对路径、别名 webpack 等术语。

但是，如果不是这样，您可以做的一件事是：

1. 创建一个名为 bundle 的文件夹
2. 创建一个 index.js 文件并从那里导出您想要的任何内容
3. 将其用作您的主要导入参考。

// bundle/index.js

export * from "react-native-x"
export {View} from "react-native"
export * from "./a"
export * from "./../../b"

一些出口参考：

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/export

// Aggregating modules
export * from …; // does not set the default export
export { name1, name2, …, nameN } from …;
export { import1 as name1, import2 as name2, …, nameN } from …;
export { default } from …;

希望对你有帮助。