Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

什么时候可以支持scss呢?less相比较scss功能缺失太多了 #128

Closed
ChenXiaoSong12321 opened this issue Apr 15, 2019 · 5 comments
Labels
cli Q&A suggestion

Comments

@ChenXiaoSong12321
Copy link

@ChenXiaoSong12321 ChenXiaoSong12321 commented Apr 15, 2019

Is your feature request related to a problem? Please describe.
A clear and concise description of what the problem is. Ex. I'm always frustrated when [...]

Describe the solution you'd like
A clear and concise description of what you want to happen.

Describe alternatives you've considered
A clear and concise description of any alternative solutions or features you've considered.

Additional context
Add any other context or screenshots about the feature request here.

@beatles-chameleon
Copy link
Collaborator

@beatles-chameleon beatles-chameleon commented Apr 16, 2019

@ChenXiaoSong12321
Copy link
Author

@ChenXiaoSong12321 ChenXiaoSong12321 commented Apr 18, 2019

@ChenXiaoSong12321
Copy link
Author

@ChenXiaoSong12321 ChenXiaoSong12321 commented Apr 18, 2019

// 解决支持scss,希望可以帮助到正在坑中或即将入坑的同学
cml.utils.plugin('webpackConfig', function({ type, media, webpackConfig }, cb) {
  const findRule = test => {
    let rules
    webpackConfig.module.rules.some((item, index) => {
      if (new RegExp(item.test).test(test)){
        rules = {rule:item, index}
        return true
      } 
    })
    return rules
  }

  // 支持scss
  const cmlFile = findRule('.cml')
  if(cmlFile){
    cmlFile.rule.use = cmlFile.rule.use.map(use => {
      use.options.loaders.scss = JSON.parse(JSON.stringify(use.options.loaders.less)).map(item => {
        if (item.loader === 'less-loader') item.loader = 'sass-loader'
        return item
      })
      return use
    })
    webpackConfig.module.rules[cmlFile.index] = cmlFile.rule
  }

  cb({
    type,
    media,
    webpackConfig
  })
})

@beatles-chameleon
Copy link
Collaborator

@beatles-chameleon beatles-chameleon commented Apr 23, 2019

相当优秀了
@ChenXiaoSong12321

@startheart startheart added cli Q&A suggestion labels May 27, 2020
@zyhlast
Copy link

@zyhlast zyhlast commented Jul 25, 2020

除以上配置外,还需安装node-sass sass-loader依赖,npm i sass-loader@6.x --save-dev npm install --save-dev node-sass , 高版本sass-loader不行,6.x版本可用。

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
cli Q&A suggestion
Projects
None yet
Development

No branches or pull requests

4 participants