vue scss의 전역 변수를 어떻게 사용합니까
1619 단어 vue
어떻게 우리 vue 프로젝트에서 전역적으로scss 파일을 도입합니까?
4
4
만약 우리가 공공scss 스타일 변수 (예를 들어 app의 테마 색상) 를 사용하고 싶다면, 우리는 단지 하나씩 쓸 수 있을 뿐이다.vue 파일은 스타일 탭에 @import '글로벌.scss' 라는 공공 scss 스타일 파일을 넣어야 하지만, 이렇게 하면 번거롭습니다.
(상기 상황은less와sass처럼 이런 문제가 존재하지만less는 다음과 같은 해결 방법이 없다.sass가 있다.)
그러나 해결 방법도 있다. 절차는 다음과 같다.node-sass,sass-loader,style-loader 설치
npm install node-sass --save-dev
npm install sass-loader --save-dev
npm install style-loader --save-dev
2.sass-resources-loader 설치
cnpm install sass-resources-loader --save-dev
4
scss: generateLoaders('sass')
:
scss: generateLoaders('sass').concat(
{
loader: 'sass-resources-loader',
options: {
resources: path.resolve(__dirname, '../src/assets/global.scss')
}
}
)
알 수 있듯이, 나는 assets에서 글로벌을 만들었다.scss는 공공 스타일 파일입니다.마지막으로 vue 구성 요소의 스타일 탭에lang="scss"를 추가하면 ok입니다.이렇게 해서 우리는 전역적으로scss를 도입하는 것을 실현하였다.
작성자: LucyLucy
링크:https://www.jianshu.com/p/78efb07949f5
출처: 약서
저작권은 작자에게 귀속된다.상업 전재는 작가에게 연락하여 권한을 부여받고, 비상업 전재는 출처를 밝혀 주십시오.
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
Fastapi websocket 및 vue 3(Composition API)1부: FastAPI virtualenv 만들기(선택 사항) FastAPI 및 필요한 모든 것을 다음과 같이 설치하십시오. 생성main.py 파일 및 실행 - 브라우저에서 이 링크 열기http://127.0.0.1:...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.
좋은 웹페이지 즐겨찾기
