В обновлении сборщика приложений в версии 17.1.0 были введены новые параметры загрузчика, что делает обработку файлов более простой и удобной. Эти параметры позволяют указать, как обрабатывать различные типы файлов.
Вот краткий обзор доступных загрузчиков:
- Загрузчик текстовых файлов (text): Преобразует содержимое файла в строку, идеально подходит для текстовых файлов.
- Бинарный загрузчик (binary): Преобразует бинарные файлы в Uint8Array, полезно для обработки бинарных данных.
- Загрузчик файлов (file): Отделяет файлы и предоставляет их расположение во время выполнения, отлично подходит для ресурсов.
- Пустой загрузчик (empty): Исключает файлы из вашего пакета.
Настройка этих загрузчиков проста. Например, чтобы встроить содержимое SVG в приложение, нужно изменить angular.json:
{
"architect": {
"build": {
"options": {
"loader": {
".svg": "text"
}
}
}
}
}
Эта настройка встраивает файлы SVG как строки, устраняя необходимость во внешних запросах файлов для ваших графических элементов:
import foo from './some-big-img.svg';
@Component({
selector: 'app-user-profile',
standalone: true,
})
export class UserProfileComponent {
constructor() {
import('./user.svg').then((res) => res.default).then(console.log);
}
}
Для обеспечения совместимости с TypeScript, особенно с пользовательскими загрузчиками, такими как для файлов SVG, добавьте файл определения типа в ваш проект. Это можно сделать, добавив файл (например, src/types.d.ts) со следующим содержимым:
declare module "*.svg" {
const content: string;
export default content;
}
Этот шаг предотвратит появление ошибок TypeScript для неизвестных типов файлов.
Это перевод оригинального материала
Больше материалов с хорошей подсветкой синтаксиса в моем блоге на teletype