vue 프로젝트 컴파일의 sass 오류 해결 방법: 1. 이미지 소스 "cnpm install node-sass sass-loader --save-dev"를 사용하여 sass를 설치합니다. 2. "패키지에서 "sass-loader" 버전을 변경합니다. .json" ""sass-loader"입니다: "^7.3.1","; 3. 페이지에서 직접 사용하거나 src 대신 @를 사용하세요.
이 튜토리얼의 운영 환경: Windows 10 시스템, sass-loader 버전 7.3.1, Dell G3 컴퓨터.
vue 프로젝트에서 sass 오류가 컴파일되면 어떻게 해야 하나요?
vue가 Sass를 사용할 때 발생하는 오류 문제 해결
sass:
설치:
npm config set registry https://registry.npm.taobao.org/ //sass-node报错的话,使用镜像源cnpm install node-sass sass-loader --save-dev 再安装一次 npm install node-sass --registry=https://registry.npm.taobao.org
package.json에서 sass-loader 버전 변경
"sass-loader": "^7.3.1",
용도:
페이지에서 src 대신 @ 또는 직접 사용(3.x에서는 @를 설정할 필요가 없고, 2.x에서는 webpack 파일에서 설정해야 함)
문제 설명:
sass 오류 보고서를 사용할 때 다음 문제가 발생했습니다.
*!!vue-style-loader!css-loader?{“sourceMap”:true}! ../../../../vue-loader/lib/style-compiler/index?{“vue”:t rue,”id”:”data-v-570115ee”,”scoped”:false,”hasInlineConfig”:false}!../../../../vux-loader/src/after-less-loader.js!less-loader?{“so urceMap”:true}!../../../../vux-loader/src/style-loader.js!../../../../vue-loader/lib/selector?type=style s&index=0!./index.vue in ./node_m odules/vux/src/components/alert /index.vue
Solution
이러한 종류의 문제는 일반적으로 관련 종속성이 부족하여 발생합니다. 이 예에서는 오류 메시지를 주의 깊게 살펴보고 키워드 vue-를 가져옵니다. style-loader!css-loader 설명은 CSS를 구문 분석하는 중에 문제가 발생했습니다.
그래서 해결책은 상황에 따라, 사용하는 CSS 언어에 따라 일반인지, 이하인지, 사스인지에 따라 달라집니다.
1. normal에서 발생하면
npm install stylus-loader css-loader style-loader --save-dev
를 실행합니다. 2. less에서 발생하면
npm install less less-loader --save-dev
를 실행합니다. 3. sass에서 발생하면
npm install sass sass-loader --save-dev
를 실행합니다. dependency
또는
$npm intall sass-loader --save ; $npm install node-sass --save
모른다면 세 가지 모두 수행하시나요?.
일반적으로 이 문제는 구성을 초기화할 때만 발생합니다. 전체 프로젝트인 경우 package.json에 구성되어 있으며 직접 설치할 수 있습니다.
추천 학습: "vue 비디오 튜토리얼"
위 내용은 Vue 프로젝트에서 SASS를 컴파일할 때 오류가 발생하면 어떻게 해야 할까요?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!