Umi: 如何开启 style-loader 的 useable 模式?

Created on 25 Apr 2019  ·  5Comments  ·  Source: umijs/umi

不想使用 css module,因为样式覆盖太麻烦。
但如果还想尽可能避免命名冲突,就会考虑每个页面进入、离开时,通过 style-loader 的 useable 功能加载和注销 css。umi 里如何使用 style-loader 的 useable 功能呢

PR Welcome type(enhancement)

Most helpful comment

能具体介绍下 style-loader 的 useable 怎么用的吗?

rules: [
  {
    test: /\.scss$/,
    use: [
      'style-loader/useable',
      'css-loader',
      'postcss-loader',
      'sass-loader',
    ]
  }
]

style-loader 的 webpack 配置大概像这样,就是不导出 css,而是添加 style 标签。
use 'style-loader' 就是 import 的时候自动添加 style 标签;
use 'style-loader/useable' 就是

import css from 'x.scss';
css.use();      // 添加 style 标签
css.unuse();  // 删除对应的 style 标签

All 5 comments

能具体介绍下 style-loader 的 useable 怎么用的吗?

能具体介绍下 style-loader 的 useable 怎么用的吗?

rules: [
  {
    test: /\.scss$/,
    use: [
      'style-loader/useable',
      'css-loader',
      'postcss-loader',
      'sass-loader',
    ]
  }
]

style-loader 的 webpack 配置大概像这样,就是不导出 css,而是添加 style 标签。
use 'style-loader' 就是 import 的时候自动添加 style 标签;
use 'style-loader/useable' 就是

import css from 'x.scss';
css.use();      // 添加 style 标签
css.unuse();  // 删除对应的 style 标签

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

赞一个,这个 issue 是不是可以关了

Was this page helpful?
0 / 5 - 0 ratings

Related issues

onReadyL picture onReadyL  ·  3Comments

tauruswang picture tauruswang  ·  3Comments

nguyenhuutinh picture nguyenhuutinh  ·  3Comments

sorrycc picture sorrycc  ·  4Comments

Artoria-0x04 picture Artoria-0x04  ·  3Comments