Try achieving css class rename some more

This commit is contained in:
Tamius Han 2021-11-21 02:07:58 +01:00
parent cf8bedfad9
commit 2be44d54ae
6 changed files with 88 additions and 16 deletions

32
package-lock.json generated
View File

@ -3433,6 +3433,15 @@
"resolved": "https://registry.npmjs.org/binary-extensions/-/binary-extensions-2.2.0.tgz",
"integrity": "sha512-jDctJ/IVQbZoJykoeHbhXpOlNBqGNcwXJKJog42E5HDPUwQTSdjCHdihjj0DlnheQ7blbT6dHOafNAiS8ooQKA=="
},
"bindings": {
"version": "1.5.0",
"resolved": "https://registry.npmjs.org/bindings/-/bindings-1.5.0.tgz",
"integrity": "sha512-p2q/t/mhvuOj/UeLlV6566GD/guowlr0hHxClI0W9m7MWYkL1F0hLo+0Aexs9HSPCtR1SXQ0TD3MMKrXZajbiQ==",
"optional": true,
"requires": {
"file-uri-to-path": "1.0.0"
}
},
"bl": {
"version": "3.0.1",
"resolved": "https://registry.npmjs.org/bl/-/bl-3.0.1.tgz",
@ -6101,6 +6110,12 @@
"resolved": "https://registry.npmjs.org/file-type/-/file-type-8.1.0.tgz",
"integrity": "sha512-qyQ0pzAy78gVoJsmYeNgl8uH8yKhr1lVhW7JbzJmnlRi0I4R2eEDEJZVKG8agpDnLpacwNbDhLNG/LMdxHD2YQ=="
},
"file-uri-to-path": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/file-uri-to-path/-/file-uri-to-path-1.0.0.tgz",
"integrity": "sha512-0Zt+s3L7Vf1biwWZ29aARiVYLx7iMGnEUl9x33fbB/j3jR81u/O2LbqK+Bm1CDSNDKVtJ/YjwY7TUd5SkeLQLw==",
"optional": true
},
"filename-reserved-regex": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/filename-reserved-regex/-/filename-reserved-regex-2.0.0.tgz",
@ -12908,6 +12923,22 @@
}
}
},
"vue-style-loader": {
"version": "4.1.3",
"resolved": "https://registry.npmjs.org/vue-style-loader/-/vue-style-loader-4.1.3.tgz",
"integrity": "sha512-sFuh0xfbtpRlKfm39ss/ikqs9AbKCoXZBpHeVZ8Tx650o0k0q/YCM7FRvigtxpACezfq6af+a7JeqVTWvncqDg==",
"requires": {
"hash-sum": "^1.0.2",
"loader-utils": "^1.0.2"
},
"dependencies": {
"hash-sum": {
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/hash-sum/-/hash-sum-1.0.2.tgz",
"integrity": "sha1-M7QHd3VMZDJXPBIMw4CLvRDUfwQ="
}
}
},
"vuex": {
"version": "4.0.2",
"resolved": "https://registry.npmjs.org/vuex/-/vuex-4.0.2.tgz",
@ -13003,6 +13034,7 @@
"integrity": "sha512-oWb1Z6mkHIskLzEJ/XWX0srkpkTQ7vaopMQkyaEIoq0fmtFVxOthb8cCxeT+p3ynTdkk/RZwbgG4brR5BeWECw==",
"optional": true,
"requires": {
"bindings": "^1.5.0",
"nan": "^2.12.1"
}
},

View File

@ -43,6 +43,7 @@
"mdi-vue": "^3.0.11",
"typescript": "^4.4.4",
"vue": "^3.2.21",
"vue-style-loader": "^4.1.3",
"vuex": "^4.0.2",
"vuex-webextensions": "^1.3.3",
"webextension-polyfill-ts": "^0.24.0"

View File

@ -85,7 +85,7 @@ export default {
}
</script>
<style lang="scss">
<style lang="scss" scoped module>
.uw-ultrawidify-container-root {
.alignment-box {
aspect-ratio: 1;

View File

@ -250,11 +250,11 @@ export default {
</style>
<style lang="scss" src="../../res/css/flex.scss" scoped></style>
<style lang="scss" src="../res-common/panels.scss" scoped></style>
<style lang="scss" src="../res-common/common.scss" scoped></style>
<style lang="scss" src="../../res/css/flex.scss" scoped module></style>
<style lang="scss" src="../res-common/panels.scss" scoped module></style>
<style lang="scss" src="../res-common/common.scss" scoped module></style>
<style lang="scss" scoped>
<style lang="scss" scoped module>
.uw-ultrawidify-container-root {
.b3 {
width: 9rem;
@ -270,5 +270,4 @@ export default {
padding-top: 8px;
}
}
</style>

17
vue.config.js Normal file
View File

@ -0,0 +1,17 @@
module.exports = {
css: {
requireModuleExtension: false,
loaderOptions: {
css: {
// Note: the following config format is different between Vue CLI v4 and v3
// For Vue CLI v3 users, please refer to css-loader v1 documentations
// https://github.com/webpack-contrib/css-loader/tree/v1.0.1
modules: {
localIdentName: '[name]-[hash]'
},
localsConvention: 'camelCaseOnly'
}
}
}
}

View File

@ -49,17 +49,40 @@ const config = {
exclude: /node_modules/,
},
{
test: /\.css$/,
use: [MiniCssExtractPlugin.loader, 'css-loader'],
},
test: /\.(sc|c)ss$/,
use: [
// MiniCssExtractPlugin.loader,
'vue-style-loader',
{
test: /\.scss$/,
use: [MiniCssExtractPlugin.loader, 'css-loader', 'sass-loader'],
loader: 'css-loader',
// modules: {
// localIdentName: "[name]-[hash]"
// }
// options: {
// modules: true,
// // localIdentName: "🔶uw_[local]"
// localIdentName: "[name]-[hash]"
// // localIdentName: "uw_[local]"
// }
},
{
test: /\.sass$/,
use: [MiniCssExtractPlugin.loader, 'css-loader', 'sass-loader?indentedSyntax'],
'sass-loader'
],
},
// {
// test: /\.scss$/,
// use: [
// // MiniCssExtractPlugin.loader,
// 'css-loader',
// // {
// // loader: 'css-loader',
// // // options: {
// // // modules: true,
// // // localIdentName: "🔶uw_[local]"
// // // }
// // },
// 'sass-loader'
// ],
// },
{
test: /\.(png|jpg|gif|svg|ico)$/,
loader: 'file-loader',