Всем привет. На связи Омельницкий Сергей. Сегодня я бы хотел рассказать, что делать если вы хотите предоставить доступ к статическому контенту, который находится вне корня исходного angular проекта.
В angular, для настроек конфигураций и рабочего окружения используют файл angular.json
. В этом файле мы можем найти свойство assets
в котором хранится массив с указанием путей к статическому контенту. В общем виде он выглядит вот так:
"assets": [
"src/favicon.ico",
"src/assets"
],
Но бывают случаи, когда проект не один, а несколько. Появляются общие статические файлы для этих проектов и возникает вопрос — А как получить к ним доступ? Если попробовать просто указать путь к файлам вне проекта в assets
, то при запуске проекта вы получите ошибку вида — An unhandled exception occurred: The configs asset path must start with the project source root.
И тут на помощь приходят расширенные настройки самого assets, а именно: вы можете сконфигурировать передаваемые параметры в качестве объекта. Этот объект может содержать в себе следующие поля:
glob
: Поиск файлов по шаблону. Для базовой директории нужно использоватьinput
.input
: Путь относительно корня рабочей области.output
: Путь относительно результирующей директории (по умолчанию dist/project-name).ignore
: Список для исключения в globs шаблоне.
Давайте трансформируем наш assets
в новый вид:
"assets": [
{ "glob": "**/*", "input": "src/assets/", "output": "/assets/" },
{ "glob": "favicon.ico", "input": "src/", "output": "/" }
]
А теперь давайте добавим папку /common
, которая находится вне проекта. Дадим ей доступ по /tmp/**/*
:
"assets": [
"src/favicon.ico",
"src/assets",
{"glob": "**/*", "input": "./common", "output": "/tmp/" }
],
Ну в общем-то и все. Подробнее почитать об этом можно в официальной документации ангуляра