Snowpack 无法从 node_modules 导入 JavaScript

Question

我目前正在使用 Snowpack 构建/准备应用程序。 我正在尝试导入作为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 ？

IE

转换.mjs：

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

node convert.mjs

然后在您的 HTML 文件中：

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

Answer 2

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

<!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

问题描述

2 个解决方案

解决方案1
1 2021-05-11 19:41:38

解决方案2
0 已采纳 2021-05-11 21:19:42

Snowpack 无法从 node_modules 导入 JavaScript

问题描述

2 个解决方案

解决方案1 1 2021-05-11 19:41:38

解决方案2 0 已采纳 2021-05-11 21:19:42

解决方案1
1 2021-05-11 19:41:38

解决方案2
0 已采纳 2021-05-11 21:19:42