Как предварительно обработать область видимости css (sass)

Question

Кто-нибудь знает как это сделать? Rsot scoped css было бы здорово, если бы я только мог использовать SASS. Я проверил документы, но не мог понять, что требуется.

Я хотел бы иметь возможность:

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

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

Answer 1

Вы можете импортировать scss в тег скрипта ，, если вы используете веб-пакет, например:

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

И мой конфиг веб-пакета:

// 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
        }]
    }]
}
};