时间戳

首页 > 解决方案 > 如果 env 是 NodeJS，则加载另一个 esm 文件

javascript - 如果 env 是 NodeJS，则加载另一个 esm 文件

问题描述

在一个文件中，我直接从 http url 加载一些内容。这在节点的...中不起作用

目前我有这种方法在节点和浏览器中都可以使用，但是顶级等待的实验性太强了，所以我正在寻找替代解决方案

// ./utilities.js

const WritableStream = globalThis.WritableStream || 
  // works for browsers
  await import('https://cdn.jsdelivr.net/npm/web-streams-polyfill@3/dist/ponyfill.es2018.mjs')
    .then(r => r.WritableStream)
    // fallback for NodeJs
    .catch(() => {
      // Error [ERR_UNSUPPORTED_ESM_URL_SCHEME]: Only file and data URLs are
      // supported by the default ESM loader. Received protocol 'https:'
      return import('web-streams-polyfill')
    })
    .then(r => r.WritableStream))

如果可能的话，我想做的是用 import maps in 覆盖./utilities.js并./node-utilities.js从package.jsonNPM 加载其余部分，而不是如果它在 NodeJS 中运行我知道网络支持 import-maps，但我想反过来做并先做网络，然后在服务器端做映射（模块解析）。

// ./utilities.js
import { WritableStream } from 'https://cdn.jsdelivr.net/npm/web-streams-polyfill@3/dist/ponyfill.es2018.mjs'
export { WritableStream }

// ./node-utilities.js
import { WritableStream } from 'web-streams-polyfill'
export { WritableStream }

// index.js

// would load ./utilities.js in the browser and `./node-utilities.js` in NodeJS
import { WritableStream } from './utilities.js'

我不想使用isNode ? import(x) : import(y)（如果更支持顶级等待，我可以使用，但事实并非如此）

我试过这个

"exports": {
   "./src/utilities.js": "./src/node-utilities.js"
},

但仍然抛出 Error [ERR_UNSUPPORTED_ESM_URL_SCHEME]: Only file and data URLs are supported by the default ESM loader. Received protocol 'https:'

标签： javascriptnode.jscross-browseres6-modules

解决方案

推荐阅读