prosource

Angular 6의 multi ./styles.css에 오류가 있습니다.

probook 2023. 6. 7. 23:00
반응형

Angular 6의 multi ./styles.css에 오류가 있습니다.

저는 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

각진.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"
        ]

스타일, 스타일, 스타일, 스타일

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

참조: 부트스트랩이 각도 6에 연결되지 않습니까?

누가 이 오류를 해결하는 것을 도와줄 수 있습니까?

angular 6 angular.json 파일에서 부트스트랩 또는 폰트어섬 css 파일을 사용하면 문제가 해결됩니다.

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

기본적으로 잘못된 길을 택합니다.우리는 다음과 같은 경로를 둘 필요가 있습니다.../node_modules/bootstrap/dist/css/bootstrap.min.cssnode_modules/bootstrap/dist/css/bootstrap.min.css.

나를 위한 이 일

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

나에게 효과가 있었던 유일한 해결책은:

1/   delete "node-modules"
2/   "npm install node-sass@4.10.0 --save"
3/   "npm install"
4/   "npm rebuild node-sass"

저도 이런 문제가 있었어요.수행할 작업:
angular.jsonfile,중 및 에 주의하십시오). ", "/"에 주의하십시오."

"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"       

변경 사항을 확인하기 위해 프로젝트를 다시 빌드하는 것을 잊지 마십시오.

저도 같은 오류에 직면했습니다.파일 경로에 따라 답변이 변경됩니다.당신의 길을 보고 다음과 같이 수정하세요.

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

            ],

또는

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

        ],

말 그대로 잘못된 길이 원인입니다.style.css 앞src/를 포함합니다.

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

저는 새로운 프로젝트를 만들 때 이런 일을 여러 번 겪었습니다.

  • bootstrap.min.css의 경로가 오류 메시지의 경로 및 angular.json과 일치하는지 확인합니다.
  • angular.json 파일을 변경할 때 응용 프로그램을 중지합니다.
  • 다시 실행

어느 쪽이든

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

또는

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

오류 메시지의 경로에 따라

styles.css 대신 각진 json 구성 파일에 부트스트랩을 추가합니다(scss가 아니라 css이기 때문에 작동하지 않습니다).

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

날 위해 일했다!

"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"
]

저는 이 오류로 고생했습니다.당신의 길을 보고 다음과 같이 수정하세요.

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

저도 같은 문제가 있었습니다.이것은 나에게 효과가 있습니다.

 "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"
        ]

저도 같은 문제가 있었고, 이것은 저에게 잘 해결되었습니다.

각진.json:

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

style.sys:

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

저도 같은 문제가 있는데 점(.) 슬래시 없이 아래 경로를 적용합니다.

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

Angular 8에서 ngx-toastr을 사용하는 것과 비슷한 문제가 있었습니다..css 스타일 참조를 angular.json 파일 내에 다음 순서로 배치해야 했습니다.

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

그리고 styles.css 파일 내의 @imports는 다음 순서로 지정됩니다.

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

그것은 문제를 해결했습니다.

저는 거의 같은 문제를 겪고 있었고, 부트스트랩 패키지도 제거하고 다시 설치하려고 했지만 효과가 없었습니다.

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"
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';

저는 완전히 새로운 앵귤러 7 프로젝트에서도 같은 문제를 겪었습니다.Just Installed, npm이 시작되고 multi./src/styles.sass에 ERROR가 발생했습니다. 그래서 angular.json을 열었고 다음을 수행했습니다.

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

해당 파일이 프로젝트 폴더에 있고 npm이 다시 시작되기 때문에 styles.sass를 styles.scss로 방금 이름을 변경했습니다.이것으로 저의 문제가 해결되었습니다.

나는 같은 오류가 발생한 후 npm update 명령을 사용하여 업데이트합니다.제거된 F:\xxx\node_modules\ngx-select-dropdown\dist\assets\style.css' 스타일에서 angular.js 파일을 변경했지만 CSS 파일이 없습니다.각진 CLI를 저장하고 중지한 후 다시 클리닝 서브를 실행합니다.잘 작동하기 시작했습니다.

https://github.com/manishjanky/ngx-select-dropdown/issues/112 최신 버전 the style.dll은 더 이상 관련이 없기 때문에 ngx-select-dll의 마지막 css 파일을 제거했습니다.이상입니다.

잘못된 파일 경로로 인해 이 유형 문제가 발생합니다.

"../node_modules/bootstrap/dist/css/bootstrap.min.css" 대신 "../node_modules/bootstrap/dist/css/bootstrap.min.css"를 사용하십시오.

저는 이것에 대한 해결책이 하나밖에 없다고 생각합니다.문제는 경로입니다.아래로 입력하지 않으면 입력이 도움이 되지 않습니다."multi./node_modules/bootstrap/dist/css/bootstrap.min.css" 오류가 발생하면 올바른 위치에 설치하지 않았음을 의미합니다.책에서 공부하는 경우에는 명령 프롬프트로 이동하고 프로젝트 폴더로 이동하여 부트스트랩을 설치하는 것이 가장 쉬운 방법입니다.또는 angular.jason 파일의 부트스트랩에 대한 전체 경로를 지정합니다.

이 왜 ㅠㅠㅠㅠangular.json

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

은 하만당의글스타일은벌로신지▁is은.styles.css

여기에 이미지 설명 입력


꼭확해주가 있는지 확인해 주세요.style.scss입니다가 입니다. 왜냐하면 오류는 당신이 가지고 있지 않다는 것이기 때문입니다.style.scssjava.

다음과 같이 노드 모듈에서 bootstrap.min.css를 styles.css 파일로 가져올 수 있습니다.

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

또는 이 부트스트랩 파일을 각도(-cli)에 추가합니다.json(이 파일은 Angular 5까지는 cli.json이고 6에서는 그냥 angular.json) 파일을 스타일 [] 아래에 둡니다.

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

우리는 파서가 부트스트랩이 설치된 경로를 찾을 수 있도록 올바른 경로를 파악하기만 하면 됩니다.

는 이 을 이스타대체다니습했에서 대체했습니다.angular.json

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

로.

"styles": ["styles.css"]

저한테 효과가 있었어요!

'styles' 및 'styles'에서 링크한 각 파일을 node modules 폴더에서 사용할 수 있는지 확인합니다.최근 프로젝트에서 패키지를 업데이트하는 동안 이 문제가 발생했습니다.우리가 각진 CLI JSON을 참조했던 일부 파일이 누락된 것을 발견했습니다.이 오류는 필요한 파일을 추가한 후 해결되었습니다.도움이 되길 바랍니다.

부트스트랩의 문제 때문인 것 같습니다. 이것을 사용해 보십시오.1단계.".../node_modules/bootstrap/dist/css/bootstrap.min.css" 2단계를 제거합니다.styles.css @import "~bootstrap/dist/css/bootstrap.css" 행을 추가하여 부트스트랩 가져오기로 이동합니다. 이러한 단계는 빌드 프로세스 중에 발생한 오류를 해결했습니다.

아래에 언급된 명령을 사용해 보십시오.

npm 노드 재구축

angular 6에서는 angular.json "/node_modules/bootstrap/dist/css/bootstrap.min.css"에서 이 행을 삭제해야 합니다.

그것은 잘 작동합니다.

"styles": [.node_styles/bootstrap/dist/bootstrap.min.bootstrap", "src/styles.dll",

프로젝트 폴더 외부에서 시작되었으며 src에 연결하여 styles.css 파일로 연결해야 합니다.복사:

"src/styles.dll"

카이림

언급URL : https://stackoverflow.com/questions/51035096/error-in-multi-styles-css-in-angular-6

반응형