Support both Webpacker and Shakapacker

Gemfile

@@ -28,13 +28,13 @@ if Pageflow::RailsVersion.experimental?
   # use shakapacker need to add it to their Gemfile themselves. Requiring
   # shakapacker in an engine file (like we normally do) would force all
   # host application to install shakapacker.
-  gem 'shakapacker'
+  gem 'shakapacker', '~> 7.0'
 else
   # Make webpacker available in specs. Host applications that want to
   # use webpacker need to add it to their Gemfile themselves. Requiring
   # webpacker in an engine file (like we normally do) would force all
   # host application to install webpacker.
-  gem 'webpacker'
+  gem 'webpacker', '~> 4.2'
 end
 
 # Make tests fail on JS errors

entry_types/scrolled/app/helpers/pageflow_scrolled/packs_helper.rb

@@ -2,7 +2,7 @@ module PageflowScrolled
   # @api private
   module PacksHelper
     def scrolled_frontend_javascript_packs_tag(entry, options)
-      if Pageflow::RailsVersion.experimental?
+      if defined?(Shakapacker)
         javascript_pack_tag(
           *scrolled_frontend_packs(entry, **options),
           defer: false
@@ -15,7 +15,7 @@ def scrolled_frontend_javascript_packs_tag(entry, options)
     end
 
     def scrolled_frontend_stylesheet_packs_tag(entry, options)
-      if Pageflow::RailsVersion.experimental?
+      if defined?(Shakapacker)
         stylesheet_pack_tag(
           *scrolled_frontend_packs(entry, **options),
           media: 'all'
@@ -29,7 +29,7 @@ def scrolled_frontend_stylesheet_packs_tag(entry, options)
     end
 
     def scrolled_editor_javascript_packs_tag(entry)
-      if Pageflow::RailsVersion.experimental?
+      if defined?(Shakapacker)
         javascript_pack_tag(
           *scrolled_editor_packs(entry),
           defer: false

entry_types/scrolled/app/helpers/pageflow_scrolled/themes_helper.rb

@@ -6,7 +6,7 @@ def scrolled_theme_asset_path(theme,
                                   theme_file_role: nil,
                                   theme_file_style: :resized,
                                   relative_url: false)
-      prefix = Pageflow::RailsVersion.experimental? ? 'static' : 'media'
+      prefix = defined?(Shakapacker) ? 'static' : 'media'
 
       path =
         theme.files.dig(theme_file_role, theme_file_style) ||

entry_types/scrolled/app/views/pageflow_scrolled/editor/entries/_head.html.erb

@@ -1,6 +1,6 @@
 <%= stylesheet_link_tag 'pageflow_paged/editor', media: 'all' %>
 
-<% if Pageflow::RailsVersion.experimental?  %>
+<% if defined?(Shakapacker)  %>
   <%= stylesheet_pack_tag 'pageflow-scrolled-frontend' %>
 <% else %>
   <%= stylesheet_packs_with_chunks_tag 'pageflow-scrolled-frontend' %>

entry_types/scrolled/lib/generators/pageflow_scrolled/install/install_generator.rb

@@ -30,18 +30,19 @@ def theme_plugin
       end
 
       def install_packages
-        if Pageflow::RailsVersion.experimental?
+        if defined?(Shakapacker)
           run 'yarn add css-loader style-loader' \
               ' mini-css-extract-plugin css-minimizer-webpack-plugin' \
-              ' postcss postcss-loader postcss-url' \
+              ' postcss postcss-preset-env postcss-loader' \
+              ' postcss-import postcss-url postcss-flexbugs-fixes' \
               ' @fontsource/source-sans-pro'
         else
           run 'yarn add postcss-url@^8.0.0 @fontsource/source-sans-pro'
         end
       end
 
       def webpack_config
-        return unless Pageflow::RailsVersion.experimental?
+        return unless defined?(Shakapacker)
 
         gsub_file(
           'config/webpack/webpack.config.js',
@@ -54,7 +55,11 @@ def webpack_config
           'const webpackConfig = generateWebpackConfig()',
           <<~JS
             const webpackConfig = merge(
-              generateWebpackConfig(),
+              generateWebpackConfig({
+                resolve: {
+                  extensions: ['.css']
+                }
+              }),
               require('pageflow/config/webpack5'),
               require('pageflow-scrolled/config/webpack')
             )
@@ -88,7 +93,7 @@ def webpack_config
       end
 
       def webpack_environment
-        return if Pageflow::RailsVersion.experimental?
+        return if defined?(Shakapacker)
 
         inject_into_file('config/webpack/environment.js',
                          before: "module.exports = environment\n") do
@@ -109,7 +114,7 @@ def webpack_environment
       end
 
       def webpacker_yml
-        return if Pageflow::RailsVersion.experimental?
+        return if defined?(Shakapacker)
 
         gsub_file('config/webpacker.yml',
                   'extract_css: false',
@@ -122,12 +127,29 @@ def webpacker_yml
       end
 
       def postcss_config
-        return if Pageflow::RailsVersion.experimental?
-
-        inject_into_file('postcss.config.js',
-                         after: "require('postcss-import'),\n") do
-          "    // Make relative urls in fontsource packages work\n" \
-          "    require('postcss-url')({url: 'rebase'}),\n"
+        if defined?(Shakapacker)
+          create_file 'postcss.config.js', <<~JS
+            module.exports = {
+              plugins: [
+                require('postcss-import'),
+                // Make relative urls in fontsource packages work
+                require('postcss-url')({url: 'rebase'}),
+                require('postcss-flexbugs-fixes'),
+                require('postcss-preset-env')({
+                  autoprefixer: {
+                    flexbox: 'no-2009'
+                  },
+                  stage: 3
+                })
+              ]
+            }
+          JS
+        else
+          inject_into_file('postcss.config.js',
+                           after: "require('postcss-import'),\n") do
+            "    // Make relative urls in fontsource packages work\n" \
+            "    require('postcss-url')({url: 'rebase'}),\n"
+          end
         end
       end
 

entry_types/scrolled/spec/support/config/webpacker.rb

@@ -1,4 +1,4 @@
-unless Pageflow::RailsVersion.experimental?
+unless defined?(Shakapacker)
   # Make sure packs are recompiled for Capybara specs when Rollup
   # outputs change
 

pageflow.gemspec

@@ -128,13 +128,6 @@ Gem::Specification.new do |s|
   # which we currently depend on in pageflow/engine.rb
   s.add_dependency 'sprockets', '< 4'
 
-  # Used for Webpack build in host application
-  if Pageflow::RailsVersion.experimental?
-    s.add_dependency 'shakapacker', '~> 7.0'
-  else
-    s.add_dependency 'webpacker', '~> 4.2'
-  end
-
   # Using translations from rails locales in javascript code.
   s.add_dependency 'i18n-js', '~> 2.1'
 
@@ -164,6 +157,13 @@ Gem::Specification.new do |s|
   # string encryptor/decryptor
   s.add_dependency 'symmetric-encryption', '~> 4.3.1'
 
+  # Used for Webpack build in host application
+  if Pageflow::RailsVersion.experimental?
+    s.add_development_dependency 'shakapacker', '~> 7.0'
+  else
+    s.add_development_dependency 'webpacker', '~> 4.2'
+  end
+
   # Used by the dummy rails application
   s.add_development_dependency 'mysql2', '~> 0.5.2'