Browse Source
* Switch to JSBundling with webpack * Set babel target attempt 1 * Fix loose babel warning * Babel target attempt 2 * Babel target attempt 3 * Maybe we need to polyfill more than just promise... * Fix promise undefined in IE11 * Target oldest browsers possible * Set browserlist in package.json * Development mode browserlist and update readme * Mode flag * Does setting es5 web target help? * It doesn't * Not using ActiveStorage * Import all of corejs * Destructuring including in present-env already * Just import what we need * Add polyfill for fetch * Stimulus polyfills * Remove unused duplicates * We don't use channels * Single babel config * Stimulus working * Add additional polyfills for Stimulus and Turbo * Additional polyfill for Turbo * Make sure we also transpile our own stimulus controller code * Add plugin-transform-spread * Defaults are fine for most babel plugins * Plugin ordering * Specify which bits exactly we want to transpile * Transpiling turbo appears to break it * Devise logout via get so we don't rely on js * Override public path for IE11 * Need to make DOM event triggers explicit for IE11 * Update helper spec * Update helper spec * Bump dependenciespull/401/head
baarkerlounger
3 years ago
committed by
GitHub
54 changed files with 768 additions and 5463 deletions
@ -0,0 +1,2 @@
|
||||
web: bin/rails server -p 3000 |
||||
js: yarn build --watch |
||||
@ -1,6 +1,6 @@
|
||||
// Load Active Admin's styles into Webpacker,
|
||||
// see `active_admin.scss` for customization.
|
||||
import "../styles/active_admin"; |
||||
import "./styles/active_admin.scss"; |
||||
|
||||
import "@activeadmin/activeadmin"; |
||||
|
||||
@ -0,0 +1,21 @@
|
||||
// This file is automatically compiled by Webpack, along with any other files
|
||||
// present in this directory. You're encouraged to place your actual application logic in
|
||||
// a relevant structure within app/javascript and only use these pack files to reference
|
||||
// that code so it'll be compiled.
|
||||
|
||||
// Polyfills for IE
|
||||
import "@webcomponents/webcomponentsjs" |
||||
import "core-js/stable" |
||||
import "regenerator-runtime/runtime" |
||||
import "@stimulus/polyfills" |
||||
import "custom-event-polyfill" |
||||
import "intersection-observer" |
||||
//
|
||||
|
||||
require.context("govuk-frontend/govuk/assets") |
||||
import { initAll } from "govuk-frontend" |
||||
import "./styles/application.scss" |
||||
import "./controllers" |
||||
import "@hotwired/turbo-rails" |
||||
|
||||
initAll() |
||||
@ -0,0 +1,19 @@
|
||||
// Load all the controllers within this directory and all subdirectories.
|
||||
// Controller files must be named *_controller.js.
|
||||
|
||||
import { application } from "./application" |
||||
|
||||
import AccessibleAutocompleteController from "./accessible_autocomplete_controller.js" |
||||
application.register("accessible-autocomplete", AccessibleAutocompleteController) |
||||
|
||||
import ConditionalQuestionController from "./conditional_question_controller.js" |
||||
application.register("conditional-question", ConditionalQuestionController) |
||||
|
||||
import GovukfrontendController from "./govukfrontend_controller.js" |
||||
application.register("govukfrontend", GovukfrontendController) |
||||
|
||||
import NumericQuestionController from "./numeric_question_controller.js" |
||||
application.register("numeric-question", NumericQuestionController) |
||||
|
||||
import TasklistController from "./tasklist_controller.js" |
||||
application.register("tasklist", TasklistController) |
||||
@ -1,6 +0,0 @@
|
||||
// Action Cable provides the framework to deal with WebSockets in Rails.
|
||||
// You can generate new channels where WebSocket features live using the `bin/rails generate channel` command.
|
||||
|
||||
import { createConsumer } from "@rails/actioncable" |
||||
|
||||
export default createConsumer() |
||||
@ -1,5 +0,0 @@
|
||||
// Load all the channels within this directory and all subdirectories.
|
||||
// Channel files must be named *_channel.js.
|
||||
|
||||
const channels = require.context('.', true, /_channel\.js$/) |
||||
channels.keys().forEach(channels) |
||||
@ -1,9 +0,0 @@
|
||||
// Load all the controllers within this directory and all subdirectories.
|
||||
// Controller files must be named *_controller.js.
|
||||
|
||||
import { Application } from "@hotwired/stimulus" |
||||
import { definitionsFromContext } from "@hotwired/stimulus-webpack-helpers" |
||||
|
||||
const application = Application.start() |
||||
const context = require.context("controllers", true, /_controller\.js$/) |
||||
application.load(definitionsFromContext(context)) |
||||
@ -1,15 +0,0 @@
|
||||
// This file is automatically compiled by Webpack, along with any other files
|
||||
// present in this directory. You're encouraged to place your actual application logic in
|
||||
// a relevant structure within app/javascript and only use these pack files to reference
|
||||
// that code so it'll be compiled.
|
||||
require.context('govuk-frontend/govuk/assets') |
||||
|
||||
import '../styles/application.scss' |
||||
import * as ActiveStorage from "@rails/activestorage" |
||||
import "channels" |
||||
import "controllers" |
||||
import "@hotwired/turbo-rails" |
||||
import { initAll } from 'govuk-frontend' |
||||
|
||||
ActiveStorage.start() |
||||
initAll() |
||||
@ -0,0 +1,9 @@
|
||||
#!/usr/bin/env bash |
||||
|
||||
if ! command -v foreman &> /dev/null |
||||
then |
||||
echo "Installing foreman..." |
||||
gem install foreman |
||||
fi |
||||
|
||||
foreman start -f Procfile.dev "$@" |
||||
@ -1,18 +0,0 @@
|
||||
#!/usr/bin/env ruby |
||||
|
||||
ENV["RAILS_ENV"] ||= ENV["RACK_ENV"] || "development" |
||||
ENV["NODE_ENV"] ||= "development" |
||||
|
||||
require "pathname" |
||||
ENV["BUNDLE_GEMFILE"] ||= File.expand_path("../../Gemfile", |
||||
Pathname.new(__FILE__).realpath) |
||||
|
||||
require "bundler/setup" |
||||
|
||||
require "webpacker" |
||||
require "webpacker/webpack_runner" |
||||
|
||||
APP_ROOT = File.expand_path("..", __dir__) |
||||
Dir.chdir(APP_ROOT) do |
||||
Webpacker::WebpackRunner.run(ARGV) |
||||
end |
||||
@ -1,18 +0,0 @@
|
||||
#!/usr/bin/env ruby |
||||
|
||||
ENV["RAILS_ENV"] ||= ENV["RACK_ENV"] || "development" |
||||
ENV["NODE_ENV"] ||= "development" |
||||
|
||||
require "pathname" |
||||
ENV["BUNDLE_GEMFILE"] ||= File.expand_path("../../Gemfile", |
||||
Pathname.new(__FILE__).realpath) |
||||
|
||||
require "bundler/setup" |
||||
|
||||
require "webpacker" |
||||
require "webpacker/dev_server_runner" |
||||
|
||||
APP_ROOT = File.expand_path("..", __dir__) |
||||
Dir.chdir(APP_ROOT) do |
||||
Webpacker::DevServerRunner.run(ARGV) |
||||
end |
||||
@ -1,5 +0,0 @@
|
||||
process.env.NODE_ENV = process.env.NODE_ENV || 'development' |
||||
|
||||
const environment = require('./environment') |
||||
|
||||
module.exports = environment.toWebpackConfig() |
||||
@ -1,5 +0,0 @@
|
||||
const { environment } = require('@rails/webpacker') |
||||
const jquery = require('./plugins/jquery') |
||||
|
||||
environment.plugins.prepend('jquery', jquery) |
||||
module.exports = environment |
||||
@ -1,7 +0,0 @@
|
||||
const webpack = require('webpack') |
||||
|
||||
module.exports = new webpack.ProvidePlugin({ |
||||
"$":"jquery", |
||||
"jQuery":"jquery", |
||||
"window.jQuery":"jquery" |
||||
}); |
||||
@ -1,5 +0,0 @@
|
||||
process.env.NODE_ENV = process.env.NODE_ENV || 'production' |
||||
|
||||
const environment = require('./environment') |
||||
|
||||
module.exports = environment.toWebpackConfig() |
||||
@ -1,5 +0,0 @@
|
||||
process.env.NODE_ENV = process.env.NODE_ENV || 'staging' |
||||
|
||||
const environment = require('./environment') |
||||
|
||||
module.exports = environment.toWebpackConfig() |
||||
@ -1,5 +0,0 @@
|
||||
process.env.NODE_ENV = process.env.NODE_ENV || 'development' |
||||
|
||||
const environment = require('./environment') |
||||
|
||||
module.exports = environment.toWebpackConfig() |
||||
@ -1,102 +0,0 @@
|
||||
# Note: You must restart bin/webpack-dev-server for changes to take effect |
||||
|
||||
default: &default |
||||
source_path: app/webpacker |
||||
source_entry_path: packs |
||||
public_root_path: public |
||||
public_output_path: packs |
||||
cache_path: tmp/cache/webpacker |
||||
webpack_compile_output: true |
||||
|
||||
# Additional paths webpack should lookup modules |
||||
# ['app/assets', 'engine/foo/app/assets'] |
||||
additional_paths: ['node_modules/govuk-frontend/govuk'] |
||||
|
||||
# Cache manifest.json for performance |
||||
cache_manifest: true |
||||
|
||||
# Extract and emit a css file |
||||
extract_css: true |
||||
|
||||
# Production depends on precompilation of packs prior to booting for performance. |
||||
compile: false |
||||
|
||||
static_assets_extensions: |
||||
- .jpg |
||||
- .jpeg |
||||
- .png |
||||
- .gif |
||||
- .tiff |
||||
- .ico |
||||
- .svg |
||||
- .eot |
||||
- .otf |
||||
- .ttf |
||||
- .woff |
||||
- .woff2 |
||||
|
||||
extensions: |
||||
- .mjs |
||||
- .js |
||||
- .sass |
||||
- .scss |
||||
- .css |
||||
- .module.sass |
||||
- .module.scss |
||||
- .module.css |
||||
- .png |
||||
- .svg |
||||
- .gif |
||||
- .jpeg |
||||
- .jpg |
||||
|
||||
development: |
||||
<<: *default |
||||
compile: true |
||||
|
||||
# Reload manifest.json on all requests so we reload latest compiled packs |
||||
cache_manifest: false |
||||
|
||||
# Extract and emit a css file |
||||
extract_css: false |
||||
|
||||
# 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: false |
||||
overlay: true |
||||
compress: true |
||||
disable_host_check: true |
||||
use_local_ip: false |
||||
quiet: false |
||||
pretty: false |
||||
headers: |
||||
'Access-Control-Allow-Origin': '*' |
||||
watch_options: |
||||
ignored: '**/node_modules/**' |
||||
|
||||
|
||||
test: |
||||
<<: *default |
||||
compile: true |
||||
|
||||
# Reload manifest.json on all requests so we reload latest compiled packs |
||||
cache_manifest: false |
||||
|
||||
# Extract and emit a css file |
||||
extract_css: false |
||||
|
||||
# Compile test packs to a separate directory |
||||
public_output_path: packs-test |
||||
|
||||
|
||||
staging: |
||||
<<: *default |
||||
|
||||
production: |
||||
<<: *default |
||||
@ -0,0 +1,70 @@
|
||||
const path = require("path") |
||||
const webpack = require("webpack") |
||||
|
||||
const MiniCssExtractPlugin = require('mini-css-extract-plugin') |
||||
const RemoveEmptyScriptsPlugin = require('webpack-remove-empty-scripts') |
||||
const CopyPlugin = require("copy-webpack-plugin"); |
||||
|
||||
const mode = process.env.NODE_ENV === 'development' ? 'development' : 'production' |
||||
|
||||
module.exports = { |
||||
mode, |
||||
devtool: "source-map", |
||||
entry: { |
||||
application: [ |
||||
"./app/frontend/application.js", |
||||
], |
||||
active_admin: [ |
||||
'./app/frontend/active_admin.js', |
||||
'./app/frontend/styles/active_admin.scss' |
||||
] |
||||
}, |
||||
module: { |
||||
rules: [ |
||||
{ |
||||
test: /\.(js|ts)$/, |
||||
include: [ |
||||
path.resolve(__dirname, 'node_modules/@hotwired/stimulus'), |
||||
path.resolve(__dirname, 'node_modules/@rails/actioncable'), |
||||
path.resolve(__dirname, 'app/frontend/controllers'), |
||||
], |
||||
use: ['babel-loader'], |
||||
}, |
||||
{ |
||||
test: /\.(png|jpe?g|gif|eot|woff2|woff|ttf|svg|ico)$/i, |
||||
use: 'file-loader', |
||||
}, |
||||
{ |
||||
test: /\.(scss|css)/i, |
||||
use: [MiniCssExtractPlugin.loader, 'css-loader', 'sass-loader'], |
||||
} |
||||
], |
||||
}, |
||||
resolve: { |
||||
modules: ['node_modules', 'node_modules/govuk-frontend/govuk'] |
||||
}, |
||||
output: { |
||||
filename: "[name].js", |
||||
// we must set publicPath to an empty value to override the default of
|
||||
// auto which doesn't work in IE11
|
||||
publicPath: '', |
||||
path: path.resolve(__dirname, "app/assets/builds"), |
||||
}, |
||||
plugins: [ |
||||
new RemoveEmptyScriptsPlugin(), |
||||
new MiniCssExtractPlugin(), |
||||
new webpack.optimize.LimitChunkCountPlugin({ maxChunks: 1 }), |
||||
new CopyPlugin({ |
||||
patterns: [ |
||||
{ from: "node_modules/govuk-frontend/govuk/assets/images", to: "images" }, |
||||
{ from: "node_modules/govuk-frontend/govuk/assets/fonts", to: "fonts" }, |
||||
], |
||||
}), |
||||
new webpack.ProvidePlugin({ |
||||
$: 'jquery', |
||||
jQuery: 'jquery', |
||||
jquery: 'jquery', |
||||
'window.jQuery': 'jquery' |
||||
}) |
||||
] |
||||
} |
||||
Loading…
Reference in new issue