Snowpack 无法从 node_modules 导入 JavaScript

Question

我目前正在使用 Snowpack build/prepare 一个应用程序。我正在尝试在 package.json 文件中导入作为 dependencies（块）的一部分安装的 JavaScript 库，但不知何故 Snowpack 没有获取该库。

这是 package.json 文件（相关内容的摘录）：

{
  "private": true,
  "type": "module",
  "scripts": {
    "build": "snowpack build",
    "preview": "snowpack dev"
  },
  "dependencies": {
    "impress.js": "1.1.0"
  },
  "devDependencies": {
    "snowpack": "3.3.7"
  },
  "engines": {
    "node": "14.x"
  }
}

snowpack.config.js 只包含这些行：

/** @type {import("snowpack").SnowpackUserConfig } */
export default {
  devOptions: {
    open: "none",
  },
  mount: {
    src: {
      url: "/",
    },
  },
};

我期待 Snowpack 将 impress.js 库与这个 HTML 文件捆绑在一起：

<!DOCTYPE html>
<html lang="en">
  <head>
    ...
  </head>
  <body>
    <script src="node_modules/impress.js/js/impress.min.js"></script>
    <script src="scripts/global.js" type="module"></script>
  </body>
</html>

有没有办法为这些东西配置 Snowpack？

Answer 1

如果您只是想将 Impress 模块转换为 ESM，您是否考虑过尝试 esinstall？

即

convert.mjs:

import {install} from 'esinstall';
await install(['impress.js'], {});

node convert.mjs

然后在您的 HTML 文件中：

 <script src="web_modules/impress.js"></script>

Answer 2

如果有人遇到与此类似的事情，我发现捆绑 Impress.js（以及可能 has/hasn 未模块化的任何其他库）的方式只是 import 它在 JavaScript 文件中（注意 HTML script 标签中的 type="module"：

<!DOCTYPE html>
<html lang="en">
  <head>
    ...
  </head>
  <body>
    <script src="scripts/global.js" type="module"></script>
  </body>
</html>

import "impress.js";

impress(); // ...bootstraps/initializes Impress.js

Snowpack 无法从 node_modules 导入 JavaScript

Snowpack cannot import JavaScript from node_modules

javascript

impress.js

snowpack