vue 프로젝트 에서 less 공공 변 수 를 추출 합 니 다.

3346 단어 버그 를 풀다vue
less 파일 과 구성 요소 스타일 코드
/*index.less*/
 /* Tip:              ,.vue    

less 전역 변수 도입 방법 1
css.loaderOptions less 를 사용 합 니 다.이 방법 은 변수 key:value 할당 만 지원 합 니 다.
module.exports = {
  css: {
  	loaderOptions: {
	  less: {
        globalVars: {
          "@color": "#f00"
        }
      }
	}
  }
}

less 전역 변수 도입 방법 2
pluginOptions 를 사용 하려 면 vue add style-resources-loader 명령 을 실행 해 야 합 니 다.명령 을 실행 하면 vue-cli-plugin-style-resources-loader 가 자동 으로 어떤 사전 컴 파일 언어 를 사용 하 는 지 알려 줍 니 다.선택 한 자동 설정 에 따라 참조 파일 의 경 로 를 입력 하 십시오.
우정 알림:이 방법 으로 위의 플러그 인 을 설치 하고 이 방안 을 포기 하면 컴 파일 할 때 오류 가 발생 할 수 있 습 니 다.npm uninstall vue-cli-plugin-style-resources-loader 에서 이 플러그 인 을 마 운 트 해제 할 수 있 습 니 다.
module.exports = {
  pluginOptions: {
  	"style-resources-loader": {
      preProcessor: "less",
      patterns: "./src/assets/variable.less"
    }
  }
}

주:밟 은 구 덩이 는 less 파일 의 줄 마다 코드 를 추가 해 야 합 니 다.분점,그렇지 않 으 면 컴 파일 이 잘못 될 것 이다.

좋은 웹페이지 즐겨찾기