8.使用scss，创建组件，scoped局部作用域

cnpm install node-sass --save-dev
cnpm install sass-loader --save-dev

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

Module build failed: TypeError: this.getResolve is not a function

cnpm uninstall sass-loader（卸载当前版本）
cnpm install sass-loader@7.3.1 --save-dev
cnpm install

<template>
<div>
<h2>这是一个首页组件h2>
<button @click="run">弹出首页组件提示button>
div>
template>
<script>
export default {
name: ‘home‘,
data () {
return {
msg:‘首页组件‘
}
},
methods:{
run(){
alert(this.msg)
}
}
}
script>
<style lang="scss" scoped>
h2{
color: red;
}
style>

<template>
<div id="app">
<h2>{{msg}}h2>
<v-home>v-home>
div>
template>
<script>
// 1.引入组件
// 2.挂载组件
// 3.在模板中引用
import Home from ‘./components/Home.vue‘;
export default {
name: ‘app‘,
data () {
return {
msg:‘根组件‘
}
},
methods:{
},
components:{
‘v-home‘:Home
}
}
script>
<style>
style>