twitch drops manager

Twitch Drops Manager

девчонка

1. Разрешить доступ к Tampermonkey к локальному файлу Uris tampermonkey/FAQ
2. Установите DEPS с npm i или npm ci .
3. npm run dev , чтобы начать вашу разработку. Теперь вы увидите 2 файла в ./dist/
   • dist/index.dev.user.js : ** Вы должны установить этот пользовательский показатель в своем браузере. ** Это простой загрузчик, который загружает dist/index.debug.js на соответствующую веб -страницу.
   • dist/index.debug.js : Это строительство разработки с eval-source-map . Он будет автоматически загружен с помощью dist/index.dev.user.js через @require file://.../dist/index.debug.js метаданные, не добавляйте его в свой менеджер пользователей.
4. Редактировать src/index.ts, вы даже можете импортировать CSS или меньше файлов. Вы можете использовать SCSS, если хотите.
5. Зайдите на https://twitch.com/ и откройте консоль, вы увидите, что она работает.

LiverelAnd включена по умолчанию, используйте это расширение Chrome

УВЕДОМЛЕНИЕ

Каждый раз, когда вы изменяете конфигурацию метаданных, вам придется перезагрузить веб -пакетный сервер и установить недавно сгенерированный dist/index.dev.user.js userscript в вашем браузере.

Перекрестный запрос

Вы можете напрямую позвонить в GM.xmlHttpRequest или использовать API Fetch на основе GM.xmlHttpRequest https://github.com/trim21/gm-wetch

Машинопись

Используйте TypeScript как обычно, см. Src/index.ts

зависимости

Есть два способа использования пакета на NPM.

Пользовательский способ

Как и оригинальный способ пользователя, вам нужно будет добавить их в раздел «Метаданные сценария пользователя» и исключить их в config/webpack.config.base.cjs

WebPack Way

Просто установите пакеты с NPM и импортируйте их в вашем коде, WebPack будет позаботиться о них.

Строить

npm run build

dist/index.prod.user.js - последний сценарий. Вы можете вручную скопировать его в Greasyfork для развертывания.

Министерство

В Greasyfork существует ограничение, ваш код не должен запутать илиниции.

Если вам не нужно развернуть свой скрипт в Greasyfork, позвольте Minify, как вам нравится.

автоматически развертывание

Действия GitHub будут развертывать производственный пользователей в филиале GH-Pages.

пример

развернуто

Вы можете автоматически использовать функцию автоматического обновления Greasyfork.

Q & A.

Вы можете обнаружить, что включение исходной карты не работает хорошо в производственном коде, потому что Tampermonkey добавит дополнительные строки (все ваши @require ) перед вашим сценарием. Я не знаю, есть ли хорошее исправление для этого, вам нужно использовать конфигурацию WebPack devtool с префиксом eval , чтобы он работал, как и ожидалось, поэтому в этом шаблоне отключена карта источника.

https://webpack.js.org/configuration/devtool/#development