Pull to refresh

Comments 11

Спасибо за полезную информацию, возьму на вооружение.
Если есть вопросы, могу дополнить статью скриншотами или подробнее рассмотреть какой-то пункт.
Что такое «неинвазивные стили»? Ну и хотелось бы примерчик css или sass.
Переименовал статью, неудачное было название. Такого термина не существует в этой сфере.

Пример здесь будет не релевантен, потому как универсальных стилей не создать и в каждом конкретном случае будет разный набор.

Для подобных целей использую browser-sync. Его можно использовать для внешнего сайта как прокси и инжектить стили и скрипты из локальной папки.

Browser-sync хорош, и вообще его использую в основном. Но тут уже надо npm иметь и конфиг сделать. А как именно вставлять стили и скрипты из локальной папки?

Вот мой простейший конфиг:


let browserSync = require('browser-sync').create();

browserSync.init({
    proxy: 'http://site.com',
    serveStatic: ['static'],
    files: ['static/**/*.*'],
    rewriteRules: [
        {
            match: /<\/head>/i,
            fn: (req, res, match) => `<link rel="stylesheet" href="/custom.css" />`
        },
        {
            match: /<\/body>/i,
            fn: (req, res, match) => `<script async src="/scripts.js"></script>`
        }
    ]
});

В serveStatic указываем из какой папки брать файлы. В rewriteRules пишем где в html и какие файлы вставлять.

Спасибо, дополнил статью

Может кому-то надо адаптировать ужасный сайт, ради развлечения сделаю. Но сайт должен быть максимально ужасным — чтобы было веселее. Внизу статьи написал дополнение.

Можете подробнее рассказать как это работает? Желательно скриншот с настройками. Если это быстро и уже есть этот софт то хорошее решение, добавлю в статью.
Sign up to leave a comment.

Articles