Closed kawasin73 closed 5 years ago
$ git diff ruby-2.4.5-rails-5.1.0-webpacker-1.2 ruby-2.4.5-rails-5.1.0-webpacker-3.5.5 --name-only
.babelrc
.gitignore
.postcssrc.yml
Gemfile
Gemfile.lock
bin/webpack
bin/webpack-dev-server
config/environments/development.rb
config/environments/production.rb
config/secrets.yml
config/webpack/configuration.js
config/webpack/development.js
config/webpack/development.server.js
config/webpack/development.server.yml
config/webpack/environment.js
config/webpack/loaders/assets.js
config/webpack/loaders/babel.js
config/webpack/loaders/coffee.js
config/webpack/loaders/erb.js
config/webpack/loaders/react.js
config/webpack/loaders/sass.js
config/webpack/paths.yml
config/webpack/production.js
config/webpack/shared.js
config/webpack/test.js
config/webpacker.yml
package.json
yarn.lock
$ git diff ruby-2.4.5-rails-5.1.0-webpacker-1.2 ruby-2.4.5-rails-5.1.0-webpacker-3.5.5
diff --git a/.babelrc b/.babelrc
index 504056b..75e4c04 100644
--- a/.babelrc
+++ b/.babelrc
@@ -3,9 +3,24 @@
[
"env",
{
- "modules": false
+ "modules": false,
+ "targets": {
+ "browsers": "> 1%",
+ "uglify": true
+ },
+ "useBuiltIns": true
}
],
"react"
+ ],
+ "plugins": [
+ "syntax-dynamic-import",
+ "transform-object-rest-spread",
+ [
+ "transform-class-properties",
+ {
+ "spec": true
+ }
+ ]
]
}
diff --git a/.gitignore b/.gitignore
index 21ed233..0e52119 100644
--- a/.gitignore
+++ b/.gitignore
@@ -15,3 +15,8 @@
/.idea
.DS_Store
+/public/packs
+/public/packs-test
+/node_modules
+yarn-debug.log*
+.yarn-integrity
diff --git a/.postcssrc.yml b/.postcssrc.yml
index bc4f02a..150dac3 100644
--- a/.postcssrc.yml
+++ b/.postcssrc.yml
@@ -1,4 +1,3 @@
plugins:
- postcss-smart-import: {}
- precss: {}
- autoprefixer: {}
+ postcss-import: {}
+ postcss-cssnext: {}
diff --git a/Gemfile b/Gemfile
index 4bd6c30..d5ffd1a 100644
--- a/Gemfile
+++ b/Gemfile
@@ -9,7 +9,7 @@ end
# Bundle edge Rails instead: gem 'rails', github: 'rails/rails'
gem 'rails', '~> 5.1.0'
-gem 'webpacker', '1.2'
+gem 'webpacker', '3.5.5'
# Use postgresql as the database for Active Record
gem 'pg', '~> 0.18'
diff --git a/Gemfile.lock b/Gemfile.lock
index 7a091ee..323d19a 100644
--- a/Gemfile.lock
+++ b/Gemfile.lock
@@ -81,6 +81,8 @@ GEM
pg (0.21.0)
puma (3.12.0)
rack (2.0.6)
+ rack-proxy (0.6.5)
+ rack
rack-test (0.6.3)
rack (>= 1.0)
rails (5.1.0)
@@ -146,9 +148,9 @@ GEM
activemodel (>= 5.0)
bindex (>= 0.4.0)
railties (>= 5.0)
- webpacker (1.2)
+ webpacker (3.5.5)
activesupport (>= 4.2)
- multi_json (~> 1.2)
+ rack-proxy (>= 0.6.1)
railties (>= 4.2)
websocket-driver (0.6.5)
websocket-extensions (>= 0.1.0)
@@ -171,7 +173,7 @@ DEPENDENCIES
tzinfo-data
uglifier (>= 1.3.0)
web-console (>= 3.3.0)
- webpacker (= 1.2)
+ webpacker (= 3.5.5)
BUNDLED WITH
1.17.1
diff --git a/bin/webpack b/bin/webpack
index a871ce7..4658327 100755
--- a/bin/webpack
+++ b/bin/webpack
@@ -1,33 +1,15 @@
#!/usr/bin/env ruby
-$stdout.sync = true
-require "shellwords"
-require "yaml"
+ENV["RAILS_ENV"] ||= ENV["RACK_ENV"] || "development"
+ENV["NODE_ENV"] ||= "development"
-ENV["RAILS_ENV"] ||= "development"
-RAILS_ENV = ENV["RAILS_ENV"]
+require "pathname"
+ENV["BUNDLE_GEMFILE"] ||= File.expand_path("../../Gemfile",
+ Pathname.new(__FILE__).realpath)
-ENV["NODE_ENV"] ||= RAILS_ENV
-NODE_ENV = ENV["NODE_ENV"]
+require "rubygems"
+require "bundler/setup"
-APP_PATH = File.expand_path("../", __dir__)
-CONFIG_PATH = File.join(APP_PATH, "config/webpack/paths.yml")
-
-begin
- paths = YAML.load(File.read(CONFIG_PATH))[NODE_ENV]
-
- NODE_MODULES_PATH = File.join(APP_PATH.shellescape, paths["node_modules"])
- WEBPACK_CONFIG_PATH = File.join(APP_PATH.shellescape, paths["config"])
-rescue Errno::ENOENT, NoMethodError
- puts "Configuration not found in config/webpack/paths.yml"
- puts "Please run bundle exec rails webpacker:install to install webpacker"
- exit!
-end
-
-WEBPACK_BIN = "#{NODE_MODULES_PATH}/.bin/webpack"
-WEBPACK_CONFIG = "#{WEBPACK_CONFIG_PATH}/#{NODE_ENV}.js"
-
-Dir.chdir(APP_PATH) do
- exec "NODE_PATH=#{NODE_MODULES_PATH} #{WEBPACK_BIN} --config #{WEBPACK_CONFIG}" \
- " #{ARGV.join(" ")}"
-end
+require "webpacker"
+require "webpacker/webpack_runner"
+Webpacker::WebpackRunner.run(ARGV)
diff --git a/bin/webpack-dev-server b/bin/webpack-dev-server
index c2a61ff..faa69f0 100755
--- a/bin/webpack-dev-server
+++ b/bin/webpack-dev-server
@@ -1,33 +1,15 @@
#!/usr/bin/env ruby
-$stdout.sync = true
-require "shellwords"
-require "yaml"
+ENV["RAILS_ENV"] ||= ENV["RACK_ENV"] || "development"
+ENV["NODE_ENV"] ||= "development"
-ENV["RAILS_ENV"] ||= "development"
-RAILS_ENV = ENV["RAILS_ENV"]
+require "pathname"
+ENV["BUNDLE_GEMFILE"] ||= File.expand_path("../../Gemfile",
+ Pathname.new(__FILE__).realpath)
-ENV["NODE_ENV"] ||= RAILS_ENV
-NODE_ENV = ENV["NODE_ENV"]
+require "rubygems"
+require "bundler/setup"
-APP_PATH = File.expand_path("../", __dir__)
-CONFIG_PATH = File.join(APP_PATH, "config/webpack/paths.yml")
-
-begin
- paths = YAML.load(File.read(CONFIG_PATH))[NODE_ENV]
-
- NODE_MODULES_PATH = File.join(APP_PATH.shellescape, paths["node_modules"])
- WEBPACK_CONFIG_PATH = File.join(APP_PATH.shellescape, paths["config"])
-
- WEBPACK_BIN = "#{NODE_MODULES_PATH}/.bin/webpack-dev-server"
- DEV_SERVER_CONFIG = "#{WEBPACK_CONFIG_PATH}/development.server.js"
-rescue Errno::ENOENT, NoMethodError
- puts "Configuration not found in config/webpacker/paths.yml."
- puts "Please run bundle exec rails webpacker:install to install webpacker"
- exit!
-end
-
-Dir.chdir(APP_PATH) do
- exec "NODE_PATH=#{NODE_MODULES_PATH} #{WEBPACK_BIN} --progress --color " \
- "--config #{DEV_SERVER_CONFIG} #{ARGV.join(" ")}"
-end
+require "webpacker"
+require "webpacker/dev_server_runner"
+Webpacker::DevServerRunner.run(ARGV)
diff --git a/config/environments/development.rb b/config/environments/development.rb
index 5187e22..dd3c780 100644
--- a/config/environments/development.rb
+++ b/config/environments/development.rb
@@ -1,4 +1,7 @@
Rails.application.configure do
+ # Verifies that versions and hashed value of the package contents in the project's package.json
+config.webpacker.check_yarn_integrity = true
+
# Settings specified here will take precedence over those in config/application.rb.
# In the development environment your application's code is reloaded on
diff --git a/config/environments/production.rb b/config/environments/production.rb
index fa34c50..34f3d40 100644
--- a/config/environments/production.rb
+++ b/config/environments/production.rb
@@ -1,4 +1,7 @@
Rails.application.configure do
+ # Verifies that versions and hashed value of the package contents in the project's package.json
+config.webpacker.check_yarn_integrity = false
+
# Settings specified here will take precedence over those in config/application.rb.
# Code is not reloaded between requests.
diff --git a/config/secrets.yml b/config/secrets.yml
index 39dd1ad..b6d7b67 100644
--- a/config/secrets.yml
+++ b/config/secrets.yml
@@ -18,10 +18,10 @@
# Environmental secrets are only available for that specific environment.
development:
- secret_key_base: 2d2809c3ab4e406bfc07254d0705064ac745aa4b5120879523b482d6460ccc99b83742fe2131de049ecb023c8e414f8a10048be28a88c59ffbd9801c0d5e6ed9
+ secret_key_base: 3392687a8da8790603c0a992b9c819876500832804bc10de30ece802953ed2ac7d5e729cb2c2574aeea87a0da6ba54a3dde2e0d240e69b456b19d9ee2ad0f573
test:
- secret_key_base: ecf2a4735470aebae527537a9d82aa7043f87c679094e7884f344380f3b2185a43052ef71290e706b6c50c4a1924cc0c4d2c4615da514d47cad836bb82962c30
+ secret_key_base: 2c4a93b820c125fa81c63145fc429925e8b8215a51e5e8994ba154aa06162832e59b7db8df2db4bb97a0e5f4801d31c304ff5752fa9e0b808573d1b8d2321b4d
# Do not keep production secrets in the unencrypted secrets file.
# Instead, either read values from the environment.
diff --git a/config/webpack/configuration.js b/config/webpack/configuration.js
deleted file mode 100644
index c8f8461..0000000
--- a/config/webpack/configuration.js
+++ /dev/null
@@ -1,26 +0,0 @@
-// Common configuration for webpacker loaded from config/webpack/paths.yml
-
-const { join, resolve } = require('path')
-const { env } = require('process')
-const { safeLoad } = require('js-yaml')
-const { readFileSync } = require('fs')
-
-const configPath = resolve('config', 'webpack')
-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' ? devServerUrl : publicUrl
-
-module.exports = {
- devServer,
- env,
- paths,
- loadersDir,
- publicUrl,
- publicPath
-}
diff --git a/config/webpack/development.js b/config/webpack/development.js
index 7dfa2df..c5edff9 100644
--- a/config/webpack/development.js
+++ b/config/webpack/development.js
@@ -1,16 +1,5 @@
-// Note: You must restart bin/webpack-dev-server for changes to take effect
+process.env.NODE_ENV = process.env.NODE_ENV || 'development'
-const merge = require('webpack-merge')
-const sharedConfig = require('./shared.js')
+const environment = require('./environment')
-module.exports = merge(sharedConfig, {
- devtool: 'sourcemap',
-
- stats: {
- errorDetails: true
- },
-
- output: {
- pathinfo: true
- }
-})
+module.exports = environment.toWebpackConfig()
diff --git a/config/webpack/development.server.js b/config/webpack/development.server.js
deleted file mode 100644
index fe840c6..0000000
--- a/config/webpack/development.server.js
+++ /dev/null
@@ -1,17 +0,0 @@
-// Note: You must restart bin/webpack-dev-server for changes to take effect
-
-const { resolve } = require('path')
-const merge = require('webpack-merge')
-const devConfig = require('./development.js')
-const { devServer, publicPath, paths } = require('./configuration.js')
-
-module.exports = merge(devConfig, {
- devServer: {
- host: devServer.host,
- port: devServer.port,
- compress: true,
- historyApiFallback: true,
- contentBase: resolve(paths.output, paths.entry),
- publicPath
- }
-})
diff --git a/config/webpack/development.server.yml b/config/webpack/development.server.yml
deleted file mode 100644
index ee588a8..0000000
--- a/config/webpack/development.server.yml
+++ /dev/null
@@ -1,17 +0,0 @@
-# Note: You must restart bin/webpack-dev-server for changes to take effect
-
-default: &default
- enabled: true
- host: localhost
- port: 8080
-
-development:
- <<: *default
-
-test:
- <<: *default
- enabled: false
-
-production:
- <<: *default
- enabled: false
diff --git a/config/webpack/environment.js b/config/webpack/environment.js
new file mode 100644
index 0000000..d16d9af
--- /dev/null
+++ b/config/webpack/environment.js
@@ -0,0 +1,3 @@
+const { environment } = require('@rails/webpacker')
+
+module.exports = environment
diff --git a/config/webpack/loaders/assets.js b/config/webpack/loaders/assets.js
deleted file mode 100644
index 595f073..0000000
--- a/config/webpack/loaders/assets.js
+++ /dev/null
@@ -1,12 +0,0 @@
-const { env, publicPath } = require('../configuration.js')
-
-module.exports = {
- test: /\.(jpg|jpeg|png|gif|svg|eot|ttf|woff|woff2)$/i,
- use: [{
- loader: 'file-loader',
- options: {
- publicPath,
- name: env.NODE_ENV === 'production' ? '[name]-[hash].[ext]' : '[name].[ext]'
- }
- }]
-}
diff --git a/config/webpack/loaders/babel.js b/config/webpack/loaders/babel.js
deleted file mode 100644
index c608e70..0000000
--- a/config/webpack/loaders/babel.js
+++ /dev/null
@@ -1,5 +0,0 @@
-module.exports = {
- test: /\.js(\.erb)?$/,
- exclude: /node_modules/,
- loader: 'babel-loader'
-}
diff --git a/config/webpack/loaders/coffee.js b/config/webpack/loaders/coffee.js
deleted file mode 100644
index dae8742..0000000
--- a/config/webpack/loaders/coffee.js
+++ /dev/null
@@ -1,4 +0,0 @@
-module.exports = {
- test: /\.coffee(\.erb)?$/,
- loader: 'coffee-loader'
-}
diff --git a/config/webpack/loaders/erb.js b/config/webpack/loaders/erb.js
deleted file mode 100644
index 4cd7d68..0000000
--- a/config/webpack/loaders/erb.js
+++ /dev/null
@@ -1,9 +0,0 @@
-module.exports = {
- test: /\.erb$/,
- enforce: 'pre',
- exclude: /node_modules/,
- loader: 'rails-erb-loader',
- options: {
- runner: 'bin/rails runner'
- }
-}
diff --git a/config/webpack/loaders/react.js b/config/webpack/loaders/react.js
deleted file mode 100644
index cfd6417..0000000
--- a/config/webpack/loaders/react.js
+++ /dev/null
@@ -1,5 +0,0 @@
-module.exports = {
- test: /\.(js|jsx)?(\.erb)?$/,
- exclude: /node_modules/,
- loader: 'babel-loader'
-}
diff --git a/config/webpack/loaders/sass.js b/config/webpack/loaders/sass.js
deleted file mode 100644
index 2cb0e75..0000000
--- a/config/webpack/loaders/sass.js
+++ /dev/null
@@ -1,14 +0,0 @@
-const ExtractTextPlugin = require('extract-text-webpack-plugin')
-const { env } = require('../configuration.js')
-
-module.exports = {
- test: /\.(scss|sass|css)$/i,
- use: ExtractTextPlugin.extract({
- fallback: 'style-loader',
- use: [
- { loader: 'css-loader', options: { minimize: env.NODE_ENV === 'production' } },
- 'postcss-loader',
- 'sass-loader'
- ]
- })
-}
diff --git a/config/webpack/paths.yml b/config/webpack/paths.yml
deleted file mode 100644
index 26ab8fa..0000000
--- a/config/webpack/paths.yml
+++ /dev/null
@@ -1,33 +0,0 @@
-# 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
- extensions:
- - .coffee
- - .js
- - .jsx
- - .ts
- - .vue
- - .sass
- - .scss
- - .css
- - .png
- - .svg
- - .gif
- - .jpeg
- - .jpg
-
-development:
- <<: *default
-
-test:
- <<: *default
- manifest: manifest-test.json
-
-production:
- <<: *default
diff --git a/config/webpack/production.js b/config/webpack/production.js
index 056ccdb..be0f53a 100644
--- a/config/webpack/production.js
+++ b/config/webpack/production.js
@@ -1,21 +1,5 @@
-// Note: You must restart bin/webpack-dev-server for changes to take effect
+process.env.NODE_ENV = process.env.NODE_ENV || 'production'
-/* eslint global-require: 0 */
+const environment = require('./environment')
-const webpack = require('webpack')
-const merge = require('webpack-merge')
-const CompressionPlugin = require('compression-webpack-plugin')
-const sharedConfig = require('./shared.js')
-
-module.exports = merge(sharedConfig, {
- output: { filename: '[name]-[chunkhash].js' },
-
- plugins: [
- new webpack.optimize.UglifyJsPlugin(),
- new CompressionPlugin({
- asset: '[path].gz[query]',
- algorithm: 'gzip',
- test: /\.(js|css|svg|eot|ttf|woff|woff2)$/
- })
- ]
-})
+module.exports = environment.toWebpackConfig()
diff --git a/config/webpack/shared.js b/config/webpack/shared.js
deleted file mode 100644
index 035e1e0..0000000
--- a/config/webpack/shared.js
+++ /dev/null
@@ -1,54 +0,0 @@
-// Note: You must restart bin/webpack-dev-server for changes to take effect
-
-/* eslint global-require: 0 */
-/* eslint import/no-dynamic-require: 0 */
-
-const webpack = require('webpack')
-const { basename, dirname, join, relative, resolve } = require('path')
-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 extensionGlob = `**/*{${paths.extensions.join(',')}}*`
-const packPaths = sync(join(paths.source, paths.entry, extensionGlob))
-
-module.exports = {
- entry: packPaths.reduce(
- (map, entry) => {
- const localMap = map
- const namespace = relative(join(paths.source, paths.entry), dirname(entry))
- localMap[join(namespace, basename(entry, extname(entry)))] = resolve(entry)
- return localMap
- }, {}
- ),
-
- output: {
- filename: '[name].js',
- path: resolve(paths.output, paths.entry),
- publicPath
- },
-
- module: {
- rules: sync(join(loadersDir, '*.js')).map(loader => require(loader))
- },
-
- 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 })
- ],
-
- resolve: {
- extensions: paths.extensions,
- modules: [
- resolve(paths.source),
- resolve(paths.node_modules)
- ]
- },
-
- resolveLoader: {
- modules: [paths.node_modules]
- }
-}
diff --git a/config/webpack/test.js b/config/webpack/test.js
index e002d0c..c5edff9 100644
--- a/config/webpack/test.js
+++ b/config/webpack/test.js
@@ -1,6 +1,5 @@
-// Note: You must restart bin/webpack-dev-server for changes to take effect
+process.env.NODE_ENV = process.env.NODE_ENV || 'development'
-const merge = require('webpack-merge')
-const sharedConfig = require('./shared.js')
+const environment = require('./environment')
-module.exports = merge(sharedConfig, {})
+module.exports = environment.toWebpackConfig()
diff --git a/config/webpacker.yml b/config/webpacker.yml
new file mode 100644
index 0000000..63d1115
--- /dev/null
+++ b/config/webpacker.yml
@@ -0,0 +1,69 @@
+# Note: You must restart bin/webpack-dev-server for changes to take effect
+
+default: &default
+ source_path: app/javascript
+ source_entry_path: packs
+ public_output_path: packs
+ cache_path: tmp/cache/webpacker
+
+ # Additional paths webpack should lookup modules
+ # ['app/assets', 'engine/foo/app/assets']
+ resolved_paths: []
+
+ # Reload manifest.json on all requests so we reload latest compiled packs
+ cache_manifest: false
+
+ extensions:
+ - .jsx
+ - .js
+ - .sass
+ - .scss
+ - .css
+ - .module.sass
+ - .module.scss
+ - .module.css
+ - .png
+ - .svg
+ - .gif
+ - .jpeg
+ - .jpg
+
+development:
+ <<: *default
+ compile: true
+
+ # Reference: https://webpack.js.org/configuration/dev-server/
+ dev_server:
+ https: false
+ host: localhost
+ port: 3035
+ public: localhost:3035
+ hmr: false
+ # Inline should be set to true if using HMR
+ inline: true
+ overlay: true
+ compress: true
+ disable_host_check: true
+ use_local_ip: false
+ quiet: false
+ headers:
+ 'Access-Control-Allow-Origin': '*'
+ watch_options:
+ ignored: /node_modules/
+
+
+test:
+ <<: *default
+ compile: true
+
+ # Compile test packs to a separate directory
+ public_output_path: packs-test
+
+production:
+ <<: *default
+
+ # Production depends on precompilation of packs prior to booting for performance.
+ compile: false
+
+ # Cache manifest.json for performance
+ cache_manifest: true
diff --git a/package.json b/package.json
index b4b5824..813d1f6 100644
--- a/package.json
+++ b/package.json
@@ -2,35 +2,13 @@
"name": "app",
"private": true,
"dependencies": {
- "autoprefixer": "^9.4.2",
- "babel-core": "^6.26.3",
- "babel-loader": "7.x",
- "babel-preset-env": "^1.7.0",
+ "@rails/webpacker": "3.5",
"babel-preset-react": "^6.24.1",
- "coffee-loader": "^0.9.0",
- "coffee-script": "^1.12.7",
- "compression-webpack-plugin": "^2.0.0",
- "css-loader": "^2.0.1",
- "extract-text-webpack-plugin": "^3.0.2",
- "file-loader": "^2.0.0",
- "glob": "^7.1.3",
- "js-yaml": "^3.12.0",
- "node-sass": "^4.11.0",
- "path-complete-extname": "^1.0.0",
- "postcss-loader": "^3.0.0",
- "postcss-smart-import": "^0.7.6",
- "precss": "^4.0.0",
"prop-types": "^15.6.2",
- "rails-erb-loader": "^5.5.0",
"react": "^16.6.3",
- "react-dom": "^16.6.3",
- "sass-loader": "^7.1.0",
- "style-loader": "^0.23.1",
- "webpack": "^4.27.1",
- "webpack-manifest-plugin": "^2.0.4",
- "webpack-merge": "^4.1.5"
+ "react-dom": "^16.6.3"
},
"devDependencies": {
- "webpack-dev-server": "^3.1.10"
+ "webpack-dev-server": "2.11.2"
}
}
git diff