Требуется модуль без веб-пакета и т. Д. - PullRequest
0 голосов
/ 13 апреля 2019

Как загрузить библиотеку, которая может быть загружена только через необходимые файлы, без использования веб-пакета, компиляции, переноса, увеличения и т. Д.

Допустим, https://github.com/stutrek/scrollMonitor

Код является ванильным javascript и не имеет внешних зависимостей, однако скрипт не может быть помещен в заголовок.

var scrollMonitor = require("scrollmonitor"); // if you're old school you can use the scrollMonitor global.

Мой предпочтительный вариант:

<script src="./scrollMonitor.js"></script>

Но это не работает. Какой следующий самый простой вариант, который позволяет избежать веб-упаковки и т. Д.?

Я пытался с ES6 import:

import * as scrollMonitor from './scrollMonitor.js';

Но это возвращает просто пустой объект.

Спасибо за помощь.

Ответы [ 2 ]

0 голосов
/ 14 апреля 2019

Похоже, что это возможно при использовании пакета getlibs :

<!-- index.html -->
<html>
<body>
    <script src="https://unpkg.com/getlibs"></script>
    <script>
         System.import("./script.js");
    </script>
</body>
</html>
// script.js
console.log(require('scrollmonitor'));

Рабочий пример: https://glitch.com/edit/#!/aromatic-flamingo

В приведенном выше скрипте scrollmonitor загружается изhttps://unpkg.com/ однако этот метод работает и с локальными файлами.Я думаю, что это полностью решает мою проблему.

Другое решение, похоже, Pika-Web:

Будущее без веб-пакета

@ pika/ web устанавливает современные зависимости npm таким образом, чтобы они могли работать в браузере, даже если они сами имеют зависимости.Вот и все.Это не инструмент для сборки и не пакет (в любом случае, в традиционном смысле).@ pika / web - это инструмент для установки зависимостей, который позволяет значительно сократить потребность в других инструментах и ​​даже полностью пропустить Webpack или Parcel.

Все сводится к компромиссу между производительностью, эффективностью кэширования и тем, какмного сложности вы чувствуете себя комфортно с.И снова, в этом вся суть @ pika / web: добавьте упаковщик, потому что это имеет смысл для вашей ситуации, а не потому, что у вас нет другого выбора.

@ pika / web проверяет ваш манифест package.json длялюбые «зависимости», которые экспортируют действительную точку входа «модуля» ESM, а затем устанавливают их в локальный каталог web_modules /.@ pika / web работает с любым пакетом ESM, даже с внутренними зависимостями ESM & Common.js.

https://www.pikapkg.com/blog/pika-web-a-future-without-webpack

Однако он работает только с действительным модулем ESM "" точка входа.Не в случае со scrollMonitor.

0 голосов
/ 14 апреля 2019

Мой предпочтительный вариант:

<script src="./scrollMonitor.js"></script>

Но это не работает.

Этот вариант поддерживается библиотекой, но его не следует помещать в head . Просто попробуйте добавить его в конец body . Также должна появиться глобальная переменная scrollMonitor.

...