vue에서 sass 구성

이번에는 Vue에서 Sass를 구성하는 방법을 알려드리겠습니다. Vue에서 Sass를 구성할 때 주의할 점은 무엇인가요?

1. webpack 템플릿을 기반으로 새 프로젝트를 생성합니다

$ vue init webpack myvue

2. 현재 디렉터리에 종속성

$ cd myvue
$ npm install

3을 설치합니다. sass 종속성 패키지

npm install --save-dev sass-loader
//sass-loader依赖于node-sass
npm install --save-dev node-sass

4를 설치합니다. conf 아래와 같이 .js 규칙에

{
 test: /\.sass$/,
 loaders: ['style', 'css', 'scss']
}

를 추가합니다.

5. APP.vue

<style lang="scss">

6에서 스타일 태그를 수정합니다. 그런 다음

$ npm run dev

7 프로젝트를 실행합니다. .vue, 효과를 볼 수 있습니까

8. 실행 결과의 배경이 회색으로 바뀌어 sass

이 사례를 읽은 후 방법을 마스터했음을 나타냅니다. 기사. 더 흥미로운 정보를 보려면 PHP 중국어 웹사이트의 기타 관련 기사를 주목하세요!

추천 자료:

프로젝트에서 PHP 정적 바인딩을 사용하는 방법

vue-router에서 전달되는 쿼리 동적 매개변수를 처리하는 방법

위 내용은 vue에서 sass 구성의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!