vue-cli4安裝scss
技術交流QQ群1093476453
1.安裝依賴包
npm install node-sass --save-dev
npm install sass-loader --save-dev
2.vue.config.js配置文件中配置css
module.exports = {
css: {
loaderOptions: {
sass: {
additionalData:`@import "./src/assets/scss/style.scss";`
}
}
}
}
- sass 版本 9以上的版本 中使用
additionalData
- 8版本 中使用
prependData
3.在 src->assets文件夾里面創建 scss
文件夾 在scss文件夾里面創建style.scss文件
例如
4.重啟服務 在需要設置全局樣式的地方引入,注意設置style lang=“scss”
<style scoped lang="scss">
.header{
padding: 20px;
.list{
font-weight: bold;
li{
float: left;
width: 25%;
text-align: center;
.price{
font-size: 30px;
margin-bottom: 10px;
}
}
}
}
</style>