Я следовал этим инструкциям https://fontawesome.com/how-to-use/on-the-web/using-with/sass
Я создал проект сегодня, и он полностью чистый.
Вот моя структура папок:
src
|-- app
| |-- app.component.css
| |-- app.component.html
| |-- app.component.spec.ts
| |-- app.component.ts
| -- app.module.ts
|-- assets
| |-- .gitkeep
| -- css
| -- normalize.css
|-- environments
| |-- environment.prod.ts
| -- environment.ts
|-- favicon.ico
|-- fontawesome
| |-- _animated.scss
| |-- _bordered-pulled.scss
| |-- _core.scss
| |-- _fixed-width.scss
| |-- _icons.scss
| |-- _larger.scss
| |-- _list.scss
| |-- _mixins.scss
| |-- _rotated-flipped.scss
| |-- _screen-reader.scss
| |-- _shims.scss
| |-- _stacked.scss
| |-- _variables.scss
| |-- brands.scss
| |-- fontawesome.scss
| |-- regular.scss
| |-- solid.scss
| -- v4-shims.scss
|-- index.html
|-- main.ts
|-- polyfills.ts
|-- scss
| -- _variables.scss
|-- styles.css
|-- test.ts
-- webfonts
|-- fa-brands-400.eot
|-- fa-brands-400.svg
|-- fa-brands-400.ttf
|-- fa-brands-400.woff
|-- fa-brands-400.woff2
|-- fa-regular-400.eot
|-- fa-regular-400.svg
|-- fa-regular-400.ttf
|-- fa-regular-400.woff
|-- fa-regular-400.woff2
|-- fa-solid-900.eot
|-- fa-solid-900.svg
|-- fa-solid-900.ttf
|-- fa-solid-900.woff
-- fa-solid-900.woff2
7 directories, 49 files
app. component. css:
@import "../fontawesome/fontawesome.scss";
@import "../fontawesome/solid.scss";
Но по какой-то причине я вижу странную ошибку:
ERROR in ./src/app/app.component.css
Module build failed (from ./node_modules/postcss-loader/src/index.js):
Error: Failed to find 'variables'
in [
C:\Projects\music\src\fontawesome
]
at C:\Projects\music\node_modules\postcss-import\lib\resolve-id.js:35:13
at async Promise.all (index 0)
at async Promise.all (index 0)
Я попытался изменить имя _variables.s css на переменные. css, но это очень глупо, и это не проблема. Помогите, пожалуйста