Fix configuration and scss to get webpack to compile

Move the Postcss config hack to postcss.config.js

app/webpacker/css/admin_v3/all.scss

@@ -2,16 +2,17 @@
 // While in feature-toggle, we inherit all files from old admin design.
 // Individual files may be copied in order to replace the old files.
 
-@import "vendor/assets/stylesheets/normalize";
-@import "vendor/assets/stylesheets/responsive-tables";
-@import "vendor/assets/stylesheets/jquery.powertip";
+// TODO remove ~
+@import "assets/stylesheets/normalize";
+@import "assets/stylesheets/responsive-tables";
+@import "assets/stylesheets/jquery.powertip";
 @import "~jquery-ui/themes/base/core";
 @import "~jquery-ui/themes/base/button";
 @import "~jquery-ui/themes/base/resizable";
-@import "vendor/assets/stylesheets/jquery-ui-theme";
+@import "assets/stylesheets/jquery-ui-theme";
 @import "~jquery-ui/themes/base/dialog";
 @import "../shared/ng-tags-input.min";
-@import "vendor/assets/stylesheets/select2.css.scss";
+@import "assets/stylesheets/select2";
 @import "~flatpickr/dist/flatpickr";
 @import "~flatpickr/dist/themes/material_blue";
 @import "~shortcut-buttons-flatpickr/dist/themes/light";
@@ -126,10 +127,10 @@
 @import "~tom-select/src/scss/tom-select.default";
 @import "components/tom_select"; // admin_v3
 
-@import "app/components/modal_component/modal_component";
-@import "app/components/vertical_ellipsis_menu_component/vertical_ellipsis_menu_component"; // admin_v3 and only V3
-@import "app/components/tag_list_input_component/tag_list_input_component";
-@import "app/webpacker/css/admin/trix.scss";
+@import "modal_component/modal_component";
+@import "vertical_ellipsis_menu_component/vertical_ellipsis_menu_component"; // admin_v3 and only V3
+@import "tag_list_input_component/tag_list_input_component";
+@import "admin/trix";
 
 @import "terms_of_service_banner"; // admin_v3
 

app/webpacker/css/darkswarm/all.scss

@@ -1,6 +1,6 @@
 
-@import 'vendor/assets/stylesheets/autocomplete';
-@import 'vendor/assets/stylesheets/leaflet';
+@import 'assets/stylesheets/autocomplete';
+@import 'assets/stylesheets/leaflet';
 @import 'variables';
 @import '../shared/variables/layout';
 @import '../shared/utilities';
@@ -77,4 +77,4 @@ ofn-modal {
 @import "../shared/question-mark-icon";
 @import '../admin/shared/scroll_bar';
 
-@import 'app/components/modal_component/modal_component';
+@import 'modal_component/modal_component';

config/webpack/base.js

@@ -2,22 +2,6 @@ const { webpackConfig } = require('@rails/webpacker')
 
 module.exports = webpackConfig
 
-// TODO see if we can remove
-function hotfixPostcssLoaderConfig (subloader) {
-  const subloaderName = subloader.loader
-  if (subloaderName === 'postcss-loader') {
-    if (subloader.options.postcssOptions) {
-      console.log(
-        '\x1b[31m%s\x1b[0m',
-        'Remove postcssOptions workaround in config/webpack/base.js'
-      )
-    } else {
-      subloader.options.postcssOptions = subloader.options.config;
-      delete subloader.options.config;
-    }
-  }
-}
-
 // TODO try removing this
 function addQuietDepsToSassLoader (subloader) {
   if (subloader.loader === 'sass-loader') {
@@ -28,11 +12,10 @@ function addQuietDepsToSassLoader (subloader) {
   }
 }
 
-webpackConfig.loaders.keys().forEach(loaderName => {
-  const loader = webpackConfig.loaders.get(loaderName);
-  if (loaderName === 'sass') {
-    loader.use.forEach(addQuietDepsToSassLoader);
-  }
-  loader.use.forEach(hotfixPostcssLoaderConfig);
-});
-
+//webpackConfig.loaders.keys().forEach(loaderName => {
+//  const loader = webpackConfig.loaders.get(loaderName);
+//  if (loaderName === 'sass') {
+//    loader.use.forEach(addQuietDepsToSassLoader);
+//  }
+//  loader.use.forEach(hotfixPostcssLoaderConfig);
+//});

postcss.config.js

@@ -1,6 +1,9 @@
 module.exports = {
   plugins: [
-    require('postcss-import'),
+    require('postcss-import')({
+      // Wepacker isn't passing the configured path to Postcss, so we specify the base path here
+      path: process.cwd()
+    }),
     require('postcss-flexbugs-fixes'),
     require('postcss-preset-env')({
       autoprefixer: {