Какой правильный подход для перекомпоновки пакета npm в моем собственном проекте? - PullRequest
Новая
       40

Какой правильный подход для перекомпоновки пакета npm в моем собственном проекте?

0 голосов
/ 09 апреля 2019

Презентация:

Я создал шаблон администратора (css + js) и загрузил его в npm. Пакет содержит скомпилированные файлы css / js в папке «dist» и файлы scss в папке «build». Пакет имеет несколько зависимостей, которые перечислены как devDependencies в package.json: 

"devDependencies": {
  "datatables.net": "^1.10.19",
  "dropzone": "^5.5.1",
  "laravel-mix": "^4.0.13",
  ...
}

Нет dependencies, что я считаю правильным, потому что я напрямую использую скомпилированные css / js (js - просто код jQuery).

Файл admin.scss содержит все импорта : 

@import 'abstracts/variables';

@import
  '~datatables.net-bs4/css/dataTables.bootstrap4.min.css',
  '~easymde/dist/easymde.min.css',
  '~flatpickr/dist/flatpickr.min.css',
  '~jasny-bootstrap/dist/css/jasny-bootstrap.min.css',
  '~selectizebootstrap/dist/css/selectize.bootstrap4.css';

@import
  'components/alerts',
  'components/cards';

Я использую пакет администратора в проекте PHP (Laravel). Пакет администратора входит в devDependencies моего проекта PHP. Файл admin.css включен в файл php.scss: 

@import '../../node_modules/admin-template/dist/css/admin.css';

Проблема:

Мне нужно изменить некоторые переменные в файле admin.scss. Итак, вместо включения скомпилированного css мне нужно включить scss: 

@import '../../node_modules/admin-template/build/scss/admin';

Если я это сделаю, я получу ошибки, потому что шаблон администратора devDependencies не установлен в моем node_modules.

Если сделать npm install в папке шаблона администратора, будет создана папка node_modules, и все зависимости будут установлены внутри этой папки.
Но ошибки не исчезают, я думаю, это из-за tilde, используемого при импорте файла scss: @import '~datatables.net-bs4/css/dataTables.bootstrap4.min.css'. Он ищет файлы в корневой папке (не в пакете).

Что мне делать?

  • Добавить весь шаблон администратора devDependencies как devDependencies моего проекта PHP? Не кажется правильным.
  • Вывести шаблон администратора devDependencies как dependencies, поэтому, когда я устанавливаю пакет, все зависимости также устанавливаются? Не кажется правильным, это devDependencies.
  • Удалить tilde ~ из всех @imports в файле admin.scss? Поэтому, если мне нужно напрямую включить scss, мне нужно сделать npm install внутри пакета. И если у меня уже установлены некоторые из этих пакетов в моем node_modules, их будет вдвое больше.
  • Есть еще варианты?

1 Ответ

0 голосов
/ 12 апреля 2019

Краткий ответ, также поместите их в поле "AdditionalDependencies" admin-template/package.json.

Таким образом, когда вы: 

cd php-project
npm install admin-template 
# or simply `npm install` if it's already in "dependencies"

«необязательные зависимости», равные admin-template, например datatables.net-bs4, будут установлены в папку node_modules верхнего уровня. Плюс, «опциональные зависимости», семантика кажется мне чертовски правильной.

Теперь, если вы действительно заботитесь о месте установки для пользователей, которые используют только .css в вашем пакете, то, к сожалению, нет простого способа сделать это.

Вы неизбежно требуете от пользователей .scss дополнительной работы. Вы либо предоставляете им руководство о том, как сделать это вручную, либо можете предоставить скрипт для автоматизации этого.

Одним из возможных решений является также предоставление файла bin. 

admin-template/bin/admin-template-enable-sass.js # or .sh if you prefer

// package.json
{
  "bin": "bin/admin-template-enable-sass.js"
}

Таким образом, когда пользователь npm install admin-template, этот bin-файл имеет символическую ссылку на верхний уровень node_module/.bin, что делает его запускаемым с помощью команды npx cli.

Теперь ваш .scss продвинутый пользователь может просто набрать: 

npx admin-template-enable-sass

чтобы ваш сценарий позаботился о них.

...