javascript/NativeScript
1
0
Fork 0
mirror of https://github.com/NativeScript/NativeScript.git synced 2025-11-05 13:26:48 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix: vue scoped css

Browse Source
This commit is contained in:
Igor Randjelovic
2021-07-01 13:50:25 +02:00
parent 2d47cf327b
commit 14edc70336
2 changed files with 31 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
packages/webpack5/__tests__/configuration/__snapshots__/vue.spec.ts.snap
View File

@@ -148,6 +148,10 @@ exports[`vue configuration for android 1`] = `
{
loader: 'css2json-loader'
},
/* config.module.rule('css').use('vue-css-loader') */
{
loader: 'vue-loader/lib/loaders/stylePostLoader.js'
},
/* config.module.rule('css').use('postcss-loader') */
{
loader: 'postcss-loader',
@@ -173,6 +177,10 @@ exports[`vue configuration for android 1`] = `
{
loader: 'css2json-loader'
},
/* config.module.rule('scss').use('vue-css-loader') */
{
loader: 'vue-loader/lib/loaders/stylePostLoader.js'
},
/* config.module.rule('scss').use('postcss-loader') */
{
loader: 'postcss-loader',
@@ -481,6 +489,10 @@ exports[`vue configuration for ios 1`] = `
{
loader: 'css2json-loader'
},
/* config.module.rule('css').use('vue-css-loader') */
{
loader: 'vue-loader/lib/loaders/stylePostLoader.js'
},
/* config.module.rule('css').use('postcss-loader') */
{
loader: 'postcss-loader',
@@ -506,6 +518,10 @@ exports[`vue configuration for ios 1`] = `
{
loader: 'css2json-loader'
},
/* config.module.rule('scss').use('vue-css-loader') */
{
loader: 'vue-loader/lib/loaders/stylePostLoader.js'
},
/* config.module.rule('scss').use('postcss-loader') */
{
loader: 'postcss-loader',

15
packages/webpack5/src/configuration/vue.ts
View File

@@ -36,6 +36,21 @@ export default function (config: Config, env: IWebpackEnv = _env): Config {
};
});
// apply vue stylePostLoader to inject component scope into the css
// this would usually be automatic, however in NS we don't use the
// css-loader, so VueLoader doesn't inject the rule at all.
config.module
.rule('css')
.use('vue-css-loader')
.after('css2json-loader')
.loader('vue-loader/lib/loaders/stylePostLoader.js');
config.module
.rule('scss')
.use('vue-css-loader')
.after('css2json-loader')
.loader('vue-loader/lib/loaders/stylePostLoader.js');
// set up ts support in vue files
config.module
.rule('ts')