feat: library refactor, mixin webpack, globally import

emulsify.libraries.yml

@@ -3,21 +3,9 @@ global:
     theme:
       dist/css/global.css: {}
 
-main-menu:
-  js:
-    dist/js/02-molecules/menus/main-menu/main-menu.js: {}
-  dependencies:
-    - core/drupal
-
 # IE 11 support for SVG use - disable if not needed.
 # See also components/01-atoms/images/icons/_icon.twig to remove attach_library.
 sprite:
   js:
     components/01-atoms/images/icons/svgxuse.min.js:
       { attributes: { defer: true } }
-
-tabs:
-  js:
-    dist/js/02-molecules/tabs/tabs.js: {}
-  dependencies:
-    - core/drupal

webpack/loaders.js

@@ -1,3 +1,4 @@
+const path = require('path');
 const MiniCssExtractPlugin = require('mini-css-extract-plugin');
 const globImporter = require('node-sass-glob-importer');
 
@@ -35,6 +36,10 @@ const CSSLoader = {
       loader: 'sass-loader',
       options: {
         sourceMap: true,
+        additionalData: `@import "${path.resolve(
+          __dirname,
+          '../components/_import.scss',
+        )}";`,
         sassOptions: {
           importer: globImporter(),
           outputStyle: 'compressed',

webpack/webpack.common.js

@@ -35,7 +35,7 @@ module.exports = {
   entry: getEntries(
     path.resolve(
       rootDir,
-      'components/**/!(*.stories|*.component|*.min|*.test).js',
+      'components/**/!(*.stories|*.component|*.min|*.mixin|*.test).js',
     ),
     path.resolve(rootDir, 'components/**/*.component.scss'),
   ),