ОШИБКА в multi./styles.css в Angular 6 - программирование
Подтвердить что ты не робот

ОШИБКА в multi./styles.css в Angular 6

Я новичок в Angular 6, В моем проекте я получил следующую ошибку

 ERROR in multi ./node_modules/bootstrap/dist/css/bootstrap.min.css ./styles.css
Module not found: Error: Can't resolve 'C:\Users\User\e-CommerceWebsite\styles.css' in 'C:\Users\User\e-CommerceWebsite'

и браузер показывает

cannot Get

angular.json

 "styles": [
          "./node_modules/bootstrap/dist/css/bootstrap.min.css",
          "styles.css"
        ],
        "scripts": [
          "./node_modules/jquery/dist/jquery.min.js",
          "./node_modules/popper.js/dist/popper.min.js",
          "./node_modules/bootstrap/dist/js/bootstrap.min.js"
        ]

styles.css

@import '~bootstrap/dist/css/bootstrap.min.css';
...
...
...

Называется следующее: бутстрап не подключается к угловому 6?

Может кто-нибудь помочь мне исправить эту ошибку.

4b9b3361

Ответ 1

В угловом файле 6 angular.json используйте загрузочный файл с бутстрапом или шрифтом, как это исправляет вашу проблему.

   "styles": [
          {
            "input": "./node_modules/bootstrap/dist/css/bootstrap.min.css"
          },
          {
            "input": "./node_modules/font-awesome/css/font-awesome.min.css"
          },
          "src/styles.css"
        ],

Ответ 2

Это в основном принимает неправильный путь. Мы должны поместить путь как ../node_modules/bootstrap/dist/css/bootstrap.min.css вместо node_modules/bootstrap/dist/css/bootstrap.min.css.

Ответ 3

Я столкнулся с той же ошибкой. В зависимости от вашего пути файла ответ меняется. Просто посмотрите на свой путь и исправьте его следующим образом.

"styles": [
              "node_modules/bootstrap/dist/css/bootstrap.min.css",
              "src/styles.css"

            ],

или же

"styles": [
          "../node_modules/bootstrap/dist/css/bootstrap.min.css",
          "../src/styles.css"

        ],

Ответ 4

Единственное решение, которое сработало для меня:

1/   delete "node-modules"
2/   "npm install [email protected] --save"
3/   "npm install"
4/   "npm rebuild node-sass"

Ответ 5

эта работа для меня

  "styles": [
         {
            "input": "./node_modules/bootstrap/dist/css/bootstrap.min.css"
          },
          "src/styles.css"
        ],

Ответ 6

У меня тоже была эта пробема. Сделай это:
в файле angular.json используйте angular.json из этих объявлений (обратите внимание на "." и "/"):

"styles": [
          {
            "input": "./node_modules/bootstrap/dist/css/bootstrap.min.css"
          },
          {
            "input": "./node_modules/font-awesome/css/font-awesome.min.css"
          },
          "src/styles.css"
        ],

или же

"styles":
         "src/styles.css",
         "node_modules/font-awesome/css/font-awesome.css"       

Не забудьте перестроить проект, чтобы увидеть изменения

Ответ 7

Добавьте bootstrap в файл конфигурации углового json вместо styles.css (он не работает, потому что он css, а не scss).

"styles": [
        "../node_modules/bootstrap/dist/css/bootstrap.min.css",
        "styles.scss"
      ],

Ответ 8

Почему вы angular.json

 "styles": ["styles.scss"],
 "scripts": []

Но ваш глобальный стиль - styles.css

enter image description here


Убедитесь, что у вас есть файл style.scss. Из-за ошибки вы не имеете файл style.scss.

Ответ 9

Вы можете импортировать bootstrap.min.css из модулей узла в файл styles.css, например

@import ~/bootstrap/dist/css/bootstrap.min.css;

Или добавьте этот файл бутстрапа в угловой (-cli). Json (этот файл будет cli.json до Angular 5 и в 6 его just angular.json) файл под стилями [].

"styles": [
        "styles.css",
        "../node_modules/bootstrap/dist/css/bootstrap.min.css"
    ],

Нам просто нужно выяснить правильный путь для анализатора, чтобы он мог найти путь, в котором установлен bootstrap.

Ответ 10

Работал для меня!

"styles": [{
    "input": "./node_modules/bootstrap/dist/css/bootstrap.min.css"
  },
  {
    "input": "./node_modules/ti-icons/css/themify-icons.css"
  },
  "src/assets/icon/icofont/css/icofont.min.css",
  "src/styles.css"
]

Ответ 11

Я заменил эти стили из angular.json

"styles": ["src/styles.css"]

в

"styles": ["styles.css"]

Это сработало для меня!

Ответ 12

проверьте, доступны ли соответствующие файлы, которые мы связали в "стилях" и "сценариях" в папке модулей узла. Недавно в моем проекте эта проблема возникла при обновлении пакетов. Я заметил, что некоторые файлы, на которые мы ссылались, были пропущены JSON. Эта ошибка была устранена после добавления необходимых файлов. Надеюсь, поможет.

Ответ 13

Я боролся с этой ошибкой. Просто посмотрите на свой путь и исправьте его следующим образом.

"styles": [
          "node_modules/@nebular/theme/styles/prebuilt/default.css"
        ],

Ответ 14

Я была такая же проблема. Этот работает для меня.

 "styles": [
          "node_modules/@angular/material/prebuilt-themes/indigo-pink.css",
          "node_modules/bootstrap/dist/css/bootstrap.css",
          "src/sass/styles.scss"
        ],

а также этот работает.

"styles": [
          "./node_modules/@angular/material/prebuilt-themes/indigo-pink.css",
          "./node_modules/bootstrap/dist/css/bootstrap.css",
          "src/sass/styles.scss"
        ]

Ответ 15

У меня была та же проблема, это сработало для меня.

angular.json:

"styles": [             
            "src/styles.css"              
        ],

styles.css:

@import "~../node_modules/bootstrap/dist/css/bootstrap.min.css";

Ответ 16

У меня та же проблема, тогда я применяю ниже путь, как это без точки (.) И косой черты /

"node_modules/bootstrap/dist/css/bootstrap.min.css",

Ответ 17

Вы выполнили команду npm я для вашего модуля?

Ответ 18

У меня была похожая проблема при использовании ngx-toastr с Angular 8. Мне пришлось разместить ссылки на стили .css в следующем порядке в файле angular.json:

        "styles": [
          "node_modules/bootstrap/dist/css/bootstrap.min.css",
          "src/styles.css",
          "node_modules/ngx-toastr/toastr.css" 
        ],
        "scripts": [
        ]

И @imports в файле styles.css в следующем порядке:

 @import '~bootstrap/dist/css/bootstrap.min.css';
 @import '~ngx-toastr/toastr.css';

Это решило проблему.

Ответ 19

Попробуйте следующую команду:

npm перестроить node-sass

Ответ 20

У меня возникла почти та же проблема, я пытался удалить и переустановить пакет Bootstrap, но это оказалось неэффективным.

ERROR in multi ../node_modules/bootstrap/dist/css/bootstrap.min.css ./src/styles.css Module not found: Error: Can't resolve 'D:\angular\node_modules\bootstrap\dist\css\bootstrap.min.css' in 'D:\angular\jsonFile'

Мой путь в angualr.json был

"../node_modules/bootstrap/dist/css/bootstrap.min.css"

удаление передних точек мне помогло.

"node_modules/bootstrap/dist/css/bootstrap.min.css"

Ответ 21

The problem can be solved in two ways:

1. Go to angular.json and under styles add the following lines

   "styles": [
              "node_modules/bootstrap/dist/css/bootstrap.min.css",
              "src/styles.css"

            ],

Or

     "styles": [
              "node_modules/bootstrap/dist/css/bootstrap.min.css",
              "src/styles.css"

              ],

Please try them the second one worked for me

2. Go to the file named "styles.css" and add the following line of code.

 @import '~bootstrap/dist/css/bootstrap.min.css';

Ответ 22

У меня была такая же проблема с новым угловым 7 проектом. Просто установил его, запустил npm и получил ошибку: ОШИБКА в multi./src/styles.sass Поэтому я открыл angular.json и:

      "styles": [
         "src/styles.sass"   <--  I had styles.scss file, not this styles.sass
       ],

Я просто переименовал styles.sass в styles.scss, потому что этот файл присутствовал в папке проекта, и npm запускается снова. Это решило мою проблему.

Ответ 23

Я думаю, что это из-за проблемы с начальной загрузкой, попробуйте это: Шаг 1. Удалите "../node_modules/bootstrap/dist/css/bootstrap.min.css" Шаг 2. Перейдите к styles.css Импортируйте загрузочную загрузку, добавив эту строку @import "~ bootstrap/dist/css/bootstrap.css"; Эти шаги решили ошибки, которые я получил во время процесса сборки.