Задать вопрос
dicem
@dicem

Почему Angular 5+ выдает ошибку при попытке подключить CSS файл в компонент?

Вобщем, занимаюсь по этому курсу: YouTube
В конце ролика автор подрубает CSS файлик в user.component.ts. Я повторяю в точности, кроме того факта, что он использует scss, а я дефолтный css. И при попытке отладки приложения:
npm run start / ng serve
Я наблюдаю такую ошибку:
ERROR in ./src/app/user/user.component.ts
Module not found: Error: Can't resolve './.user.component.css' in 'C:\Users\Albert\Documents\АЛЬБЕРТА\Phone Gap\AngularLoftProject\www\src\app\user'
resolve './.user.component.css' in 'C:\Users\Albert\Documents\АЛЬБЕРТА\Phone Gap\AngularLoftProject\www\src\app\user'
  using description file: C:\Users\Albert\Documents\АЛЬБЕРТА\Phone Gap\AngularLoftProject\www\package.json (relative path: ./src/app/user)
    Field 'browser' doesn't contain a valid alias configuration
  after using description file: C:\Users\Albert\Documents\АЛЬБЕРТА\Phone Gap\AngularLoftProject\www\package.json (relative path: ./src/app/user)
    using description file: C:\Users\Albert\Documents\АЛЬБЕРТА\Phone Gap\AngularLoftProject\www\package.json (relative path: ./src/app/user/.user.component.css)
      no extension
        Field 'browser' doesn't contain a valid alias configuration
        C:\Users\Albert\Documents\АЛЬБЕРТА\Phone Gap\AngularLoftProject\www\src\app\user\.user.component.css doesn't exist
      .ts
        Field 'browser' doesn't contain a valid alias configuration
        C:\Users\Albert\Documents\АЛЬБЕРТА\Phone Gap\AngularLoftProject\www\src\app\user\.user.component.css.ts doesn't exist
      .js
        Field 'browser' doesn't contain a valid alias configuration
        C:\Users\Albert\Documents\АЛЬБЕРТА\Phone Gap\AngularLoftProject\www\src\app\user\.user.component.css.js doesn't exist
      as directory
        C:\Users\Albert\Documents\АЛЬБЕРТА\Phone Gap\AngularLoftProject\www\src\app\user\.user.component.css doesn't exist
[C:\Users\Albert\Documents\АЛЬБЕРТА\Phone Gap\AngularLoftProject\www\src\app\user\.user.component.css]
[C:\Users\Albert\Documents\АЛЬБЕРТА\Phone Gap\AngularLoftProject\www\src\app\user\.user.component.css.ts]
[C:\Users\Albert\Documents\АЛЬБЕРТА\Phone Gap\AngularLoftProject\www\src\app\user\.user.component.css.js]
[C:\Users\Albert\Documents\АЛЬБЕРТА\Phone Gap\AngularLoftProject\www\src\app\user\.user.component.css]
 @ ./src/app/user/user.component.ts 17:21-53
 @ ./src/app/app.module.ts
 @ ./src/main.ts
 @ multi webpack-dev-server/client?http://0.0.0.0:0 ./src/main.ts

webpack: Failed to compile.


Рыскал в интеренете, некоторые предлагают поставить пакетичи
npm install --save-dev style-loader
npm install --save-dev css-loader

Я их поставил и толку не прибавилось, кто то советовал рыскать в сторону того, что webpack просто мол не разрешает импортировать css файлики. Однако там англоязычные ресурсы и я даже не вник в тему, потому хочу попросить помощи у вас.
  • Вопрос задан
  • 272 просмотра
Подписаться 1 Простой 4 комментария
Решения вопроса 1
StivinKing
@StivinKing
'./.user.component.css'

имя файла у Вас с точки начинается
Ответ написан
Комментировать
Пригласить эксперта
Ответы на вопрос 1
Negwereth
@Negwereth
lvivcss.com.ua
Ну так мало установить, надо их ещё и в webpack.config в билд процесс вставить.

А чем дефолтный способ подключения стилей для компонента не подошёл?
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы