1

我目前正在使用 Snowpack 构建/准备应用程序。我正在尝试导入作为文件中dependencies(block) 的一部分安装的 JavaScript 库package.json，但不知何故 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: "/",
    },
  },
};

impress.js我期待 Snowpack 将库与这个 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？

4

2 回答 2

1

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

IE

转换.mjs：

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

node convert.mjs

然后在您的 HTML 文件中：

 <script src="web_modules/impress.js"></script>
于 2021-05-11T19:41:38.900 回答
1

如果有人遇到与此类似的事情，我发现捆绑的方式Impress.js（可能还有任何其他已经/尚未模块化的库）只是import在 JavaScript 文件中（注意type="module"HTMLscript标记中的）：

<!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
于 2021-05-11T21:19:42.717 回答