使用Rollup实现的绝对导入

Question

我正在尝试像以下这样导入：

import { startup } from "applicationRoot/renderUI";

我希望能够在我的应用程序中随时随地工作。我认为rollup-plugin-alias很适合这种情况。我尝试过配置。

alias({
  applicationRoot: "applicationRoot/"
})

在我的插件数组中。这个方法接近了，但扩展名被删除了，因此我收到了错误：

c：\path\to\applicationRoot\renderUI不存在。

添加进去

alias({
  resolve: [".js"],
  applicationRoot: "applicationRoot/"
}),

没有更改任何内容。

- Adam Rackis

---

为什么第一个在任何模块中都不能工作？ - Liam

@Liam 因为这是一个非相对导入 - Adam Rackis

你的根目录中有一个文件，你想要避免使用所有的 ../ 吗？ - Liam

我想要在我的应用程序的任何级别中执行 import { startup } from "applicationRoot/renderUI"; 并使其正常工作。 - Adam Rackis

Answer 1

你可以使用 rollup-plugin-includepaths。

将此添加到您的 Rollup 配置中：

import includePaths from 'rollup-plugin-includepaths';

export default {
  ...
  plugins: [
    ...
    includePaths({ paths: ["./"] })
  ]
};

这将告诉Rollup还要从应用程序的根目录解析导入，因此像

import { startup } from "applicationRoot/renderUI";

它将适当地找到一个名为applicationRoot的文件夹。

- Michał Perłakowski

---

非常感谢！你很接近了 - 我进行了一些小的调整 :) - Adam Rackis

谢谢你的回答 - 正是我现在正在寻找的。我有点惊讶Rollup没有本地支持这个功能。 - JavaKungFu

在你的回答中，如果paths['./']包含./folder，那么rollup-plugin-includepaths会包含它吗？还是我需要更具体地说明？或者在路径参数中添加正则表达式？ - Jujubes

Answer 2

这不是对原问题的答案，但如果您从搜索结果进入此处并使用Typescript，则可以在tsconfig中设置compilerOptions.baseUrl，它就能正常工作。

{
  ...
  compilerOptions: {
    ...
    "baseUrl": "./"
  },
}

如果你有一个名为`src/lib/util.ts`的文件，你可以引入它：

import util from 'src/lib/util'

- Maciej Krawczyk