有没有办法在Webpack/NextJs中映射重复导入路径？

Question

我有一个 NextJs 项目（v14.1.3），我想知道是否有办法让它导入

import foo from 'path/to/foo/foo'

可以写成

import foo from 'path/to/foo'

同时仍将

foo

文件保留在

foo

目录中

Answer 1

您可以使用导入地图https://github.com/WICG/import-maps，例如，

  <script type="importmap">
    {
      "imports": {
        "Buffer": "https://gist.githubusercontent.com/guest271314/08b19ba88c98a465dd09bcd8a04606f6/raw/f7ae1e77fb146843455628042c8fa47aec2644eb/buffer-bun-bundle.js",
        "base32-encode": "https://esm.sh/[email protected]",
        "cborg": "https://esm.sh/[email protected]",
        "commander": "https://esm.sh/[email protected]",
        "mime": "https://esm.sh/[email protected]",
        "to-data-view": "https://esm.sh/[email protected]",
        "wbn": "https://esm.sh/[email protected]",
        "wbn-sign-webcrypto": "./wbn-sign.js",
        "zod": "https://esm.sh/[email protected]"
      }
    }
  </script>

const { Buffer } = await import("Buffer");

和

import { BundleBuilder as BundleBuilder2 } from "wbn";
import mime from "mime";
import { combineHeadersForUrl } from "wbn";
import { IntegrityBlockSigner, WebBundleId } from "wbn-sign-webcrypto";

Node.js 不支持导入映射，因此您必须使用它们的加载器机制，例如 https://github.com/nodejs/node/blob/main/doc/api/module.md#import-来自-https。