feat: replace local @import in scss with global webpack config

phanan · phanan · commit e52e53aee5a2 · 2021-05-29T16:39:02.000+02:00
diff --git a/js/components/album/card.vue b/js/components/album/card.vue
@@ -115,8 +115,6 @@ export default mixins(albumAttributes).extend({
 </script>
 
 <style lang="scss">
-@import "~#/partials/_mixins.scss";
-
 .sep {
   display: none;
 
diff --git a/js/components/album/info.vue b/js/components/album/info.vue
@@ -86,8 +86,6 @@ export default Vue.extend({
 </script>
 
 <style lang="scss">
-@import "~#/partials/_mixins.scss";
-
 .album-info {
   @include artist-album-info();
 }
diff --git a/js/components/artist/card.vue b/js/components/artist/card.vue
@@ -109,7 +109,5 @@ export default mixins(artistAttributes).extend({
 </script>
 
 <style lang="scss">
-@import "~#/partials/_mixins.scss";
-
 @include artist-album-card();
 </style>
diff --git a/js/components/artist/info.vue b/js/components/artist/info.vue
@@ -78,8 +78,6 @@ export default Vue.extend({
 </script>
 
 <style lang="scss">
-@import "~#/partials/_mixins.scss";
-
 .artist-info {
   @include artist-album-info();
 
diff --git a/js/components/layout/app-footer/other-controls.vue b/js/components/layout/app-footer/other-controls.vue
@@ -112,8 +112,6 @@ export default Vue.extend({
 </script>
 
 <style lang="scss" scoped>
-@import "~#/partials/_mixins.scss";
-
 .other-controls {
   @include vertical-center();
 
diff --git a/js/components/layout/app-footer/player-controls.vue b/js/components/layout/app-footer/player-controls.vue
@@ -77,8 +77,6 @@ export default Vue.extend({
 </script>
 
 <style lang="scss" scoped>
-@import "~#/partials/_mixins.scss";
-
 .player-controls {
   @include vertical-center();
   flex: 0 0 256px;
diff --git a/js/components/layout/app-header.vue b/js/components/layout/app-header.vue
@@ -71,8 +71,6 @@ export default Vue.extend({
 </script>
 
 <style lang="scss">
-@import "~#/partials/_mixins.scss";
-
 #mainHeader {
   height: var(--header-height);
   background: var(--color-bg-secondary);
diff --git a/js/components/layout/main-wrapper/extra-panel.vue b/js/components/layout/main-wrapper/extra-panel.vue
@@ -174,8 +174,6 @@ export default Vue.extend({
 </script>
 
 <style lang="scss">
-@import "~#/partials/_mixins.scss";
-
 #extra {
   flex: 0 0 var(--extra-panel-width);
   padding-top: 2.3rem;
diff --git a/js/components/layout/main-wrapper/sidebar.vue b/js/components/layout/main-wrapper/sidebar.vue
@@ -120,8 +120,6 @@ export default Vue.extend({
 </script>
 
 <style lang="scss">
-@import "~#/partials/_mixins.scss";
-
 #sidebar {
   flex: 0 0 256px;
   background-color: var(--color-bg-secondary);
diff --git a/js/components/playlist/smart-playlist/rule.vue b/js/components/playlist/smart-playlist/rule.vue
@@ -132,8 +132,6 @@ export default Vue.extend({
 </script>
 
 <style lang="scss" scoped>
-@import "~#/partials/_mixins.scss";
-
 .row {
   display: flex;
 
diff --git a/js/components/screens/album-list.vue b/js/components/screens/album-list.vue
@@ -69,8 +69,6 @@ export default mixins(infiniteScroll).extend({
 </script>
 
 <style lang="scss">
-@import "~#/partials/_mixins.scss";
-
 #albumsWrapper {
   .albums {
     @include artist-album-wrapper();
diff --git a/js/components/screens/album.vue b/js/components/screens/album.vue
@@ -146,8 +146,6 @@ export default mixins(hasSongList, albumAttributes).extend({
 </script>
 
 <style lang="scss" scoped>
-@import "~#/partials/_mixins.scss";
-
 #albumWrapper {
   @include artist-album-info-wrapper();
 }
diff --git a/js/components/screens/artist-list.vue b/js/components/screens/artist-list.vue
@@ -69,8 +69,6 @@ export default mixins(infiniteScroll).extend({
 </script>
 
 <style lang="scss">
-@import "~#/partials/_mixins.scss";
-
 #artistsWrapper {
   .artists {
     @include artist-album-wrapper();
diff --git a/js/components/screens/artist.vue b/js/components/screens/artist.vue
@@ -144,8 +144,6 @@ export default mixins(hasSongList, artistAttributes).extend({
 </script>
 
 <style lang="scss" scoped>
-@import "~#/partials/_mixins.scss";
-
 #artistWrapper {
   @include artist-album-info-wrapper();
 }
diff --git a/js/components/screens/search/excerpts.vue b/js/components/screens/search/excerpts.vue
@@ -97,8 +97,6 @@ export default Vue.extend({
 </script>
 
 <style lang="scss" scoped>
-@import "~#/partials/_mixins.scss";
-
 .results > section {
   margin-bottom: 3em;
 }
diff --git a/js/components/song/add-to-menu.vue b/js/components/song/add-to-menu.vue
@@ -131,8 +131,6 @@ export default mixins(songMenuMethods).extend({
 </script>
 
 <style lang="scss" scoped>
-@import "~#/partials/_mixins.scss";
-
 .add-to {
   @include context-menu();
 
diff --git a/js/components/song/card.vue b/js/components/song/card.vue
@@ -90,8 +90,6 @@ export default Vue.extend({
 </script>
 
 <style lang="scss" scoped>
-@import "~#/partials/_mixins.scss";
-
 article {
   display: flex;
 
diff --git a/js/components/ui/btn.vue b/js/components/ui/btn.vue
@@ -9,8 +9,6 @@ export default {}
 </script>
 
 <style lang="scss" scoped>
-@import "~#/partials/_mixins.scss";
-
 button {
   background: var(--color-blue);
   color: var(--color-text-primary);
diff --git a/js/components/ui/context-menu.vue b/js/components/ui/context-menu.vue
@@ -97,8 +97,6 @@ export default Vue.extend({
 </script>
 
 <style lang="scss" scoped>
-@import "~#/partials/_mixins.scss";
-
 .menu {
   @include context-menu();
   position: fixed;
diff --git a/js/components/ui/overlay.vue b/js/components/ui/overlay.vue
@@ -59,8 +59,6 @@ export default Vue.extend({
 </script>
 
 <style lang="scss">
-@import "~#/partials/_mixins.scss";
-
 #overlay {
   background-color: var(--color-bg-primary);
   flex-direction: column;
diff --git a/js/components/ui/search-form.vue b/js/components/ui/search-form.vue
@@ -58,8 +58,6 @@ export default Vue.extend({
 </script>
 
 <style lang="scss">
-@import "~#/partials/_mixins.scss";
-
 #searchForm {
   @include vertical-center();
   flex: 0 0 256px;
diff --git a/js/components/ui/text-zoomer.vue b/js/components/ui/text-zoomer.vue
@@ -36,8 +36,6 @@ export default Vue.extend({
 </script>
 
 <style lang="scss" scoped>
-@import "~#/partials/_mixins";
-
 .text-zoomer {
   display: flex;
   transition: .2s;
diff --git a/js/components/user/badge.vue b/js/components/user/badge.vue
@@ -38,8 +38,6 @@ export default Vue.extend({
 </script>
 
 <style lang="scss">
-@import "~#/partials/_mixins.scss";
-
 #userBadge {
   @include vertical-center();
 
diff --git a/js/remote/app.vue b/js/remote/app.vue
@@ -247,8 +247,6 @@ export default Vue.extend({
 </script>
 
 <style lang="scss">
-@import "~#/partials/_vars.scss";
-@import "~#/partials/_mixins.scss";
 @import "~#/partials/_shared.scss";
 
 body, html {
diff --git a/sass/app.scss b/sass/app.scss
@@ -1,7 +1,5 @@
 @charset "utf-8";
 
-@import "~#/partials/_vars.scss";
-@import "~#/partials/_mixins.scss";
 @import "~#/partials/_hacks.scss";
 
 @import "~#/vendor/_plyr.scss";
diff --git a/sass/partials/_shared.scss b/sass/partials/_shared.scss
@@ -1,5 +1,3 @@
-@import "~#/partials/_mixins.scss";
-
 *, *::before, *::after {
   box-sizing: border-box;
   outline: none;

Original file line number	Diff line number	Diff line change
`@@ -86,8 +86,6 @@ export default Vue.extend({`
`86`	`86`	`</script>`
`87`	`87`
`88`	`88`	`<style lang="scss">`
`89`		`-@import "~#/partials/_mixins.scss";`
`90`		`-`
`91`	`89`	`.album-info {`
`92`	`90`	`@include artist-album-info();`
`93`	`91`	`}`