Fix asset host support & improve output path

lib/install/config/webpack/configuration.js

@@ -10,17 +10,29 @@ const loadersDir = join(__dirname, 'loaders')
 const paths = safeLoad(readFileSync(join(configPath, 'paths.yml'), 'utf8'))[env.NODE_ENV]
 const devServer = safeLoad(readFileSync(join(configPath, 'development.server.yml'), 'utf8'))[env.NODE_ENV]
 
-// Compute public path based on environment and ASSET_HOST in production
-const ifHasCDN = env.ASSET_HOST !== undefined && env.NODE_ENV === 'production'
-const devServerUrl = `http://${devServer.host}:${devServer.port}/${paths.entry}/`
-const publicUrl = ifHasCDN ? `${env.ASSET_HOST}/${paths.entry}/` : `/${paths.entry}/`
-const publicPath = env.NODE_ENV !== 'production' && devServer.enabled ? devServerUrl : publicUrl
+function removeOuterSlashes(string) {
+  return string.replace(/^\/*/, '').replace(/\/*$/, '')
+}
+
+function formatPublicPath(host = '', path = '') {
+  let formattedHost = removeOuterSlashes(host)
+  if (formattedHost && !/^http/i.test(formattedHost)) {
+    formattedHost = `//${formattedHost}`
+  }
+  const formattedPath = removeOuterSlashes(path)
+  return `${formattedHost}/${formattedPath}/`
+}
+
+const output = {
+  path: resolve('public', paths.output),
+  publicPath: formatPublicPath(env.ASSET_HOST, paths.output)
+}
 
 module.exports = {
   devServer,
   env,
   paths,
   loadersDir,
-  publicUrl,
-  publicPath
+  output,
+  formatPublicPath
 }

lib/install/config/webpack/development.server.js

@@ -1,18 +1,33 @@
 // Note: You must restart bin/webpack-dev-server for changes to take effect
 
-const { resolve } = require('path')
 const merge = require('webpack-merge')
+const ManifestPlugin = require('webpack-manifest-plugin')
 const devConfig = require('./development.js')
-const { devServer, publicPath, paths } = require('./configuration.js')
+const { devServer, paths, output, formatPublicPath } = require('./configuration.js')
+
+const { host, port } = devServer
+const contentBase = output.path
+const publicPath = formatPublicPath(`http://${host}:${port}`, paths.output)
+
+// Remove ManifestPlugin so we can replace it with a new one
+devConfig.plugins = devConfig.plugins.filter(plugin => plugin.constructor.name !== 'ManifestPlugin')
 
 module.exports = merge(devConfig, {
+  output: {
+    publicPath
+  },
+
   devServer: {
-    host: devServer.host,
-    port: devServer.port,
+    host,
+    port,
+    contentBase,
+    publicPath,
     compress: true,
     headers: { 'Access-Control-Allow-Origin': '*' },
-    historyApiFallback: true,
-    contentBase: resolve(paths.output, paths.entry),
-    publicPath
-  }
+    historyApiFallback: true
+  },
+
+  plugins: [
+    new ManifestPlugin({ fileName: paths.manifest, publicPath, writeToFileEmit: true })
+  ]
 })

lib/install/config/webpack/paths.yml

@@ -1,12 +1,12 @@
 # Note: You must restart bin/webpack-dev-server for changes to take effect
 
-default: &default
-  config: config/webpack
-  entry: packs
-  output: public
-  manifest: manifest.json
-  node_modules: node_modules
-  source: app/javascript
+default: &default            # ~ = Rails.root
+  source: app/javascript     # ~/:source
+  entry: packs               # ~/:source/:entry
+  output: packs              # ~/public/:output
+  manifest: manifest.json    # ~/public/:output/:manifest
+  config: config/webpack     # ~/:config
+  node_modules: node_modules # ~/:node_modules
   extensions:
     - .coffee
     - .js

lib/install/config/webpack/shared.js

@@ -9,7 +9,7 @@ const { sync } = require('glob')
 const ExtractTextPlugin = require('extract-text-webpack-plugin')
 const ManifestPlugin = require('webpack-manifest-plugin')
 const extname = require('path-complete-extname')
-const { env, paths, publicPath, loadersDir } = require('./configuration.js')
+const { env, paths, output, loadersDir } = require('./configuration.js')
 
 const extensionGlob = `**/*{${paths.extensions.join(',')}}*`
 const packPaths = sync(join(paths.source, paths.entry, extensionGlob))
@@ -26,8 +26,8 @@ module.exports = {
 
   output: {
     filename: '[name].js',
-    path: resolve(paths.output, paths.entry),
-    publicPath
+    path: output.path,
+    publicPath: output.publicPath
   },
 
   module: {
@@ -37,7 +37,11 @@ module.exports = {
   plugins: [
     new webpack.EnvironmentPlugin(JSON.parse(JSON.stringify(env))),
     new ExtractTextPlugin(env.NODE_ENV === 'production' ? '[name]-[hash].css' : '[name].css'),
-    new ManifestPlugin({ fileName: paths.manifest, publicPath, writeToFileEmit: true })
+    new ManifestPlugin({
+      fileName: paths.manifest,
+      publicPath: output.publicPath,
+      writeToFileEmit: true
+    })
   ],
 
   resolve: {

lib/tasks/webpacker/clobber.rake

@@ -3,9 +3,9 @@ require "webpacker/configuration"
 namespace :webpacker do
   desc "Remove the webpack compiled output directory"
   task clobber: ["webpacker:verify_install", :environment] do
-    packs_path = Webpacker::Configuration.packs_path
-    FileUtils.rm_r(packs_path) if File.exist?(packs_path)
-    puts "Removed webpack output path directory #{packs_path}"
+    output_path = Webpacker::Configuration.output_path
+    FileUtils.rm_r(output_path) if File.exist?(output_path)
+    puts "Removed webpack output path directory #{output_path}"
   end
 end
 

lib/tasks/webpacker/compile.rake

@@ -6,7 +6,7 @@ namespace :webpacker do
   desc "Compile javascript packs using webpack for production with digests"
   task compile: ["webpacker:verify_install", :environment] do
     puts "Compiling webpacker assets 🎉"
-    asset_host = Rails.application.config.action_controller.asset_host
+    asset_host = ActionController::Base.helpers.compute_asset_host
     asset_env = asset_host ? "ASSET_HOST=#{asset_host}" : ""
     result = `#{asset_env} NODE_ENV=#{Webpacker.env} ./bin/webpack --json`
 
@@ -15,7 +15,7 @@ namespace :webpacker do
       exit! $?.exitstatus
     end
 
-    puts "Compiled digests for all packs in #{Webpacker::Configuration.packs_path}: "
+    puts "Compiled digests for all packs in #{Webpacker::Configuration.entry_path}: "
     puts JSON.parse(File.read(Webpacker::Configuration.manifest_path))
   end
 end

lib/webpacker/configuration.rb

@@ -4,42 +4,54 @@
 
 class Webpacker::Configuration < Webpacker::FileLoader
   class << self
-    def config_path
-      Rails.root.join(paths.fetch(:config, "config/webpack"))
-    end
-
     def entry_path
-      Rails.root.join(source_path, paths.fetch(:entry, "packs"))
+      source_path.join(fetch(:entry))
     end
 
-    def file_path
-      Rails.root.join("config", "webpack", "paths.yml")
+    def output_path
+      public_path.join(fetch(:output))
     end
 
     def manifest_path
-      Rails.root.join(packs_path, paths.fetch(:manifest, "manifest.json"))
+      output_path.join(fetch(:manifest))
     end
 
-    def packs_path
-      Rails.root.join(output_path, paths.fetch(:entry, "packs"))
+    def source_path
+      Rails.root.join(source)
     end
 
-    def paths
-      load if Webpacker.env.development?
-      raise Webpacker::FileLoader::FileLoaderError.new("Webpacker::Configuration.load must be called first") unless instance
-      instance.data
+    def public_path
+      Rails.root.join("public")
     end
 
-    def output_path
-      Rails.root.join(paths.fetch(:output, "public"))
+    def config_path
+      Rails.root.join(fetch(:config))
+    end
+
+    def file_path(root: Rails.root)
+      root.join("config/webpack/paths.yml")
+    end
+
+    def default_file_path
+      file_path(root: Pathname.new(__dir__).join("../install"))
     end
 
     def source
-      paths.fetch(:source, "app/javascript")
+      fetch(:source)
     end
 
-    def source_path
-      Rails.root.join(source)
+    def fetch(key)
+      paths.fetch(key, default_paths[key])
+    end
+
+    def paths
+      load if Webpacker.env.development?
+      raise Webpacker::FileLoader::FileLoaderError.new("Webpacker::Configuration.load must be called first") unless instance
+      instance.data
+    end
+
+    def default_paths
+      @default_paths ||= HashWithIndifferentAccess.new(YAML.load(default_file_path.read)["default"])
     end
   end
 

lib/webpacker/manifest.rb

@@ -24,7 +24,7 @@ def lookup(name)
     end
 
     def lookup_path(name)
-      Rails.root.join(File.join(Webpacker::Configuration.output_path, lookup(name)))
+      Rails.root.join(File.join(Webpacker::Configuration.public_path, lookup(name)))
     end
 
     private

test/configuration_test.rb

@@ -21,13 +21,8 @@ def test_manifest_path
     assert_equal Webpacker::Configuration.manifest_path.to_s, manifest_path
   end
 
-  def test_packs_path
-    packs_path = File.join(File.dirname(__FILE__), "test_app/public/packs").to_s
-    assert_equal Webpacker::Configuration.packs_path.to_s, packs_path
-  end
-
   def test_output_path
-    output_path = File.join(File.dirname(__FILE__), "test_app/public").to_s
+    output_path = File.join(File.dirname(__FILE__), "test_app/public/packs").to_s
     assert_equal Webpacker::Configuration.output_path.to_s, output_path
   end