fix(webpack): angular component css handling (#9434)

* feat: use raw-loader for all css but app.s?css

* feat: use angular css rules for entire app dir

Co-authored-by: Eduardo Speroni <edusperoni@gmail.com>
This commit is contained in:
Igor Randjelovic
2021-08-03 14:37:58 +02:00
committed by GitHub
parent 0a6f80a554
commit cb91cd8a3f
2 changed files with 36 additions and 26 deletions

View File

@ -52,13 +52,18 @@ export default function (config: Config, env: IWebpackEnv = _env): Config {
// exclude component css files from the normal css rule
config.module
.rule('css')
.exclude // exclude *.component.{platform}.css
.add(/\.component(\.\w+)?\.css$/);
.include.add(resolve(getEntryDirPath(), 'app.css'))
.add(resolve(getEntryDirPath(), `app.${platform}.css`))
.add(/node_modules/);
// and instead use raw-loader, since that's what angular expects
config.module
.rule('css|component')
.test(/\.component(\.\w+)?\.css$/)
.exclude.add(resolve(getEntryDirPath(), 'app.css'))
.add(resolve(getEntryDirPath(), `app.${platform}.css`))
.add(/node_modules/)
.end()
.test(/\.css$/)
.use('raw-loader')
.loader('raw-loader');
@ -71,13 +76,18 @@ export default function (config: Config, env: IWebpackEnv = _env): Config {
// exclude component css files from the normal css rule
config.module
.rule('scss')
.exclude // exclude *.component.{platform}.scss
.add(/\.component(\.\w+)?\.scss$/);
.include.add(resolve(getEntryDirPath(), 'app.scss'))
.add(resolve(getEntryDirPath(), `app.${platform}.scss`))
.add(/node_modules/);
// and instead use raw-loader, since that's what angular expects
config.module
.rule('scss|component')
.test(/\.component(\.\w+)?\.scss$/)
.exclude.add(resolve(getEntryDirPath(), 'app.css'))
.add(resolve(getEntryDirPath(), `app.${platform}.css`))
.add(/node_modules/)
.end()
.test(/\.scss$/)
.use('raw-loader')
.loader('raw-loader')
.end()