Импорт шрифтов CSS в Выборы с использованием React - PullRequest
0 голосов
/ 18 октября 2018

Я использую

@font-face {
    font-family: 'Roboto-Thin';
    src: url("../Fonts/Roboto-Thin.ttf");
}

в своем CSS-файле для импорта шрифта.Работает нормально в React в браузере.Когда я строю реактивный проект, а затем компилирую его с помощью электрона, шрифт не отображается.

В моих файлах JS для ссылки на актив, который я использую, требуется, например:

src={require("../images/stop.svg")}

Я сделалследующее, потому что я не хотел извлекать реакцию по порядку для редактирования путей в конфигурации веб-пакета (электронные пути основаны на файлах):

const WEB_FOLDER = '../build';
const PROTOCOL = 'file';

electron.protocol.interceptFileProtocol(PROTOCOL, (request, callback) => {
    // // Strip protocol
    let url = request.url.substr(PROTOCOL.length + 1);

    // Build complete path for node require function
    url = path.join(__dirname, WEB_FOLDER, url);

    // Replace backslashes by forward slashes (windows)
    // url = url.replace(/\\/g, '/');
    url = path.normalize(url);

    console.log(url);
    callback({path: url});
});

const startUrl = process.env.ELECTRON_START_URL || url.format({
    pathname: 'index.html',
    protocol: PROTOCOL + ':',
    slashes: true
});

Это работает для всего, кроме моего импорта CSS.Как я могу использовать CSS

 src: url("../Fonts/Roboto-Thin.ttf");

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

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