이제 Vue-cli 단일 파일 구성 요소에 less, sass 및 css 스타일을 도입하는 다양한 방법에 대해 간략하게 설명하겠습니다. 이는 좋은 참조 가치가 있으며 모든 사람에게 도움이 되기를 바랍니다.
vue-cli에는 sass 및 lass 구성이 내장되어 있습니다. 필요한 경우 두 개의 모듈을 직접 다운로드하면 webpack은 자동으로 적절한 로더를 사용하여 lang 속성을 기반으로 이를 처리합니다.
sass를 사용해야 한다면 다음을 설치하세요:
npm install node-sass --save-dev npm install sass-loader --save-dev
less를 사용해야 한다면 다음을 설치하세요:
npm install less --save-dev npm install less-loader --save-dev
Sass의 인라인 쓰기:
<style lang="sass" scoped> //sass样式 </style>
less의 인라인 쓰기:
<style lang="less" scoped> //less样式 </style>
css 인라인으로 작성됨:
<style lang="css" scoped> //css样式 </style>
sass가 인용됨:
<style lang="sass" src="./index.sass"></style>
less가 인용됨:
<style lang="less" src="./index.less"></style>
css가 인용됨:
<style lang="css"> @import './index.css' </style> 或者 <style lang="css" src="./index.css"></style>
위 내용은 제가 모든 사람을 위해 편집한 내용입니다. 도움이 되기를 바랍니다. 앞으로도 모든 사람에게.
관련 기사:
Angular는 대문자/소문자 필터를 사용하여 대소문자 변환 기능 예시를 구현합니다.
Angular는 작업 이벤트 명령 ng-click을 사용하여 여러 매개변수 예시를 전달합니다.
JavaScript 코드를 구현합니다. txt 파일 업로드 미리보기 기능
위 내용은 Vue-cli 단일 파일 구성 요소에 less, sass 및 css 스타일을 도입하는 다양한 방법에 대한 간략한 설명의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!