Электрон: Как импортировать или включить CSS установленный с помощью npm менеджер пакетов в нашем индексе. html?

Question

Во время разработки в каталоге root нашего проекта Electron находится папка node_modules, в которой содержатся все установленные нами пакеты. Итак, во время разработки мы можем написать что-то вроде этого, чтобы импортировать наш CSS файл на нашу веб-страницу:

<link rel="stylesheet" href="node_modules/bootstrap/dist/css/bootstrap.css">

Как мы можем включить CSS для проекта, который предназначен для упаковки и распространения без node_modules?

Редактировать: После некоторых исследований я обнаружил, что node_modules не предназначен для использования таким образом (см. это ). Тем не менее, если что-то изменится в будущем, пожалуйста, не стесняйтесь добавлять свой ответ.

Ссылка на репозиторий, с которого я начал: https://github.com/electron/electron-quick-start

Answer 1

Проведя некоторые исследования и поскольку вы используете оригинальный шаблон, я установил его и сделал то же, что вы сказали. Поскольку ваша основная проблема заключается в импорте таблиц стилей в производство при упаковке, вы можете использовать electron-packager для создания своего приложения, что приведет к тому, что последнее будет независимым от модуля узла, который вы установили во время разработки. Вы можете выполнить следующие шаги для тестирования:

1. npm i
2. npm i bootstrap --save
3. добавлено <link rel="stylesheet" href="node_modules/bootstrap/dist/css/bootstrap.css"> в голову
4. добавлено <button type="button" class="btn btn-danger">Button</button> в теле для проверки

5. npm install electron-packager --save

6. Добавьте "build": "electron-packager . --asar" к вашему scripts в package.json

7. npm run build

Тогда вы увидите, что Bootstrap используется нормально.