Js-файл внутри node_modules недоступен для index.html

Я играю с stencil, что я уже сделал:

  1. Создал компонент по трафарету
  2. Опубликовал в npm
  3. Создал угловой проект
  4. Установлен трафарет в угловой проект.
  5. Добавлен файл component.js в файл index.html

Когда я добавляю

<script src="/node_modules/stencil-poc-ng/dist/mycomponent.js"></script>

затем консоль браузера выдает следующую ошибку:

ПОЛУЧИТЕ http://localhost:4200/node_modules/stencil-poc-ng/dist/mycomponent.js 404 (не найдено) localhost /: 1 Отказался выполнить сценарий из 'http://localhost:4200/node_modules/stencil-poc-ng/dist/mycomponent.js ', потому что его тип MIME (' text / html ') не является исполняемым, включена строгая проверка типов MIME.


angular stencils
person Lalit Kushwah    schedule 27.06.2018    source источник

Ответы (2)


arrow_upward
2
arrow_downward

Вы создаете приложение Angular, оно не сможет получить доступ к локальному пути на вашем компьютере при запуске в вашем браузере. Что делает Angular ng serve:

  • Объедините весь свой код и зависимости в файл HTML, файл CSS и несколько файлов JS.
  • Сохраните все эти файлы в памяти (RAM)
  • Запустите веб-сервер для обслуживания этих файлов

Обслуживаются только файлы "в памяти", тогда ваш http://localhost:4200/node_modules/stencil-poc-ng/dist/mycomponent.js всегда будет недействительным

У вас осталось только два варианта:

  • Импортируйте ваш JS-файл, чтобы он был включен в сборку Angular
  • Используйте <script src='https://unpkg.com/[email protected]/dist/mycomponent.js'></script>
person Guerric P    schedule 27.06.2018
comment
Спасибо за ответ, я уже сделал это раньше, и его работа, но трафареты документ github.com/ ionic-team / stencil-component-starter говорит о том, что я сделал. Пожалуйста, посмотрите раздел Node Modules - person Lalit Kushwah; 27.06.2018
comment
В документации по трафарету не сказано, в каком случае это решение действительно. Я подробно изложил свой ответ, чтобы объяснить, почему это решение несовместимо с Angular. - person Guerric P; 27.06.2018
comment
Да, я не жалуюсь на ваш ответ. Мне любопытно, что у них есть раздел Node Modules, и они упомянули его для использования в качестве модуля node, поэтому меня беспокоит только то, почему он не работает. Кстати, спасибо за ответ - person Lalit Kushwah; 27.06.2018
comment
Возможно, это решение работает с веб-серверами node.js, которые обслуживают папку node_modules, я, честно говоря, не знаю ни одного возможного варианта использования для такого рода реализации. - person Guerric P; 27.06.2018

arrow_upward
0
arrow_downward

Есть два способа использовать компонент stencil в проекте Angular, и вот они:

  1. Добавьте удаленный путь к вашему js-файлу, например: https://unpkg.com/ {имя-модуля} @ {версия-модуля} / dist / {релевантный-js-

  2. Добавьте свой файл js в папку с ресурсами, причина в том, что angular находит активы, которые упомянуты в массиве ресурсов файла angular.json или angular.cli.json.

Спасибо @YoukouleleY за предложение первого решения и за правильную причину, по которой я не могу получить доступ ко второму.

person Lalit Kushwah    schedule 28.06.2018