如何預處理範圍的CSS（sass）

Question

有誰知道如何做到這一點？如果只有我可以使用SASS，暴亂範圍的CSS將會非常棒。我檢查了docs，但無法理解需要什麼。

我想能夠：

<style scoped> 
    @extend %my-sass-extension; 

    h1 { 
    color: $my-color; 
    } 
</style 

Answer 1

可以在腳本代碼中導入SCSS，如果你使用的WebPack，像這樣：

<script> 
    import './page-head.scss' 
</script> 

而且我的WebPack配置：

// webpack.config.js 
module.exports = { 
... 
module: { 
    rules: [{ 
     test: /\.scss$/, 
     use: [{ 
      loader: "style-loader" // creates style nodes from JS strings 
     }, { 
      loader: "css-loader" // translates CSS into CommonJS 
     }, { 
      loader: "sass-loader" // compiles Sass to CSS 
     }] 
    }] 
} 
};