twitch drops manager

Twitch Drops Manager

Dev

1. Permitir acesso a tampermonkey ao arquivo local Uris Tampermonkey/FAQ
2. Instale os DEPS com npm i ou npm ci .
3. npm run dev para iniciar seu desenvolvimento. Agora você verá 2 arquivos em ./dist/
   • dist/index.dev.user.js : ** Você deve instalar este Usuárioscript no seu navegador. ** É um carregador simples que carrega dist/index.debug.js na página da web correspondente.
   • dist/index.debug.js : Este é o desenvolvimento do desenvolvimento com eval-source-map . Ele será carregado automaticamente por dist/index.dev.user.js via @require file://.../dist/index.debug.js metadados, não o adicione ao seu gerenciador de usuários.
4. Editar src/index.ts, você pode até importar CSS ou menos arquivos. Você pode usar o SCSS, se quiser.
5. Vá para https://twitch.com/ e abra o console, você verá que está funcionando.

O LiveLOAD é ativado por padrão, use esta extensão Chrome

PERCEBER

Toda vez que você altera sua configuração de metadados, você precisará reiniciar o WebPack Server e instalar o recém -gerado dist/index.dev.user.js UserScript no seu navegador novamente.

Solicitação transversal do site

Você pode ligar diretamente GM.xmlHttpRequest ou usar uma API de busca baseada em GM.xmlHttpRequest https://github.com/trim21/gm-fetch

TypeScript

Use o TypeScript normalmente, consulte SRC/Index.ts

dependências

Existem duas maneiras de usar um pacote no NPM.

UserScript Way

Como a maneira original do UsuserScript, você precisará adicioná -los à seção de necessidade dos metadados do seu script de usuário e excluí -los em config/webpack.config.base.cjs

Webpack Way

Basta instalar pacotes com o NPM e importá -los no seu código, o WebPack cuidará deles.

Construir

npm run build

dist/index.prod.user.js é o script final. Você pode copiá -lo manualmente para o Greasyfork para implantar.

Minificar

Existe uma limitação no forfork grease, seu código não deve ser ofuscado ou minificado.

Se você não precisar implantar seu script para Greasyfork, ative o Minify conforme desejar.

implantar automaticamente

As ações do GitHub implantarão usuários de produção na filial de gh-pages.

exemplo

implantado

Você pode usar automaticamente a função de atualização automática do Greasyfork.

Q&A

Você pode encontrar o mapa de origem habilitando que não está funcionando bem no código de produção, porque o TamperMonkey adicionará linhas extras (todo o seu @require ) antes do seu script. Não sei se há uma boa correção para isso, você precisa usar o WebPack Config devtool com o Prefix eval para fazê -lo funcionar conforme o esperado, para que o mapa de origem esteja desativado neste modelo.

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