安装sass-loader
npm install sass-loader@10.2.0 --save-dev
安装node-sass
npm install node-sass --save-dev
重启服务
npm run serve
App.vue
<template>
<div id="app">
<Example></Example>
</div>
</template>
<script>
import Example from './components/Example'
export default {
name: 'App',
components:{
Example
}
}
</script>
<style scoped>
</style>
Example.vue
<template>
<div id="example">
<p>scss语法支持</p>
<ul>
<li>li1</li>
<li>li1</li>
<li>li1</li>
</ul>
</div>
</template>
<script>
export default {
name: "Example",
};
</script>
<style scoped lang="scss">
#example{
p{
text-align: center;
color:#fff;
background-color: #0c63e4;
}
ul {
list-style: none;
li {
width: 50%;
margin: 0 auto;
background-color: #ccc;
}
}
}
</style>
浏览器显示