shakapacker 6.1.1 → 6.2.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 5e8eb4a9da593290c85f4a4225565a8ebdde75e1a994be209a319da4e85951de
-  data.tar.gz: a662b202fa970d2f87713e7f1cb4fbf39b584d6638eb0d05c57a923a024e41d8
+  metadata.gz: c6e31a49e348719f7663178aee3ec877d3a53f6bd9e264fd8e82278ac17070e7
+  data.tar.gz: c2d9294063be7bab761baf8f10eeb82c350dfcc0bfc322cac52fa06fdb4cbef5
 SHA512:
-  metadata.gz: 64c7b38f28f82090984e322e276a15c093acf086262f5dd043e712613aedaf6196bbefa0413679e4629ec8ef547861cb5a9e032b30685c2dae6a6756cb2aa0f8
-  data.tar.gz: e0849b58c3025876469b6db0166df9c0496c7cac0c6b3c8a64c91959c61153b2e2e6acc596bf41a9cf6a02fd60c0e4be64e51513059e0b0893195ead4778cf3c
+  metadata.gz: 6cb3b71113fd1c7aad90098a4b0927830347feafe9cb9ef245aa6551950d67b9488be5d9aa411fcb6f775260856189d9cbfc5899732113fffbd7549aee84b7ef
+  data.tar.gz: 1729dccb33de9f34a2c3ca26268c79255e813a71fae548acd5066d7faaef30e4a58123955a32e7b48c19bb988cd078f407cbdcebae6bcf817522451914fbac7e

data/.node-version

@@ -1 +1 @@
-16
+16.14.0

data/CHANGELOG.md

@@ -7,6 +7,19 @@ Changes since last non-beta release.
 
 *Please add entries here for your pull requests that are not yet released.*
 
+## [v6.2.0] - March 22, 2022
+
+### Added
+- Make manifest_path configurable, to keep manifest.json private if desired. [PR 78](https://github.com/shakacode/shakapacker/pull/78) by [jdelStrother](https://github.com/jdelStrother).
+- Rewrite webpack module rules as regular expressions. Allows for easy iteration during config customization. [PR 60](https://github.com/shakacode/shakapacker/pull/60) by [blnoonan](https://github.com/blnoonan).
+- Initialization check to ensure shakapacker gem and NPM package version are consistent. Opt-in behaviour enabled by setting `ensure_consistent_versioning` configuration variable. [PR 51](https://github.com/shakacode/shakapacker/pull/51) by [tomdracz](https://github.com/tomdracz).
+- Add `dev_server.inline_css: bool` config option to allow for opting out of style-loader and into mini-extract-css-plugin for CSS HMR in development. [PR 69](https://github.com/shakacode/shakapacker/pull/69) by [cheald](https://github.com/cheald).
+
+### Improved
+- Increase default connect timeout for dev server connections, establishing connections more reliably for busy machines. [PR 74](https://github.com/shakacode/shakapacker/pull/74) by [stevecrozz](https://github.com/stevecrozz).
+- Allow multiple invocations of stylesheet_pack_tag (eg for a regular stylesheet & a print stylesheet). [PR 82](https://github.com/shakacode/shakapacker/pull/82) by [jdelStrother](https://github.com/jdelStrother).
+- Tweak swc config for parity with Babel. [PR 79](https://github.com/shakacode/shakapacker/pull/79) by [dleavitt](https://github.com/dleavitt).
+
 ## [v6.1.1] - February 6, 2022
 
 ### Added
@@ -74,8 +87,9 @@ Changes since last non-beta release.
 ## v5.4.3 and prior changes from rails/webpacker
 See [CHANGELOG.md in rails/webpacker (up to v5.4.3)](https://github.com/rails/webpacker/blob/master/CHANGELOG.md) 
 
-[Unreleased]: https://github.com/shakacode/shakapacker/compare/v6.1.1...master
-[v6.1.1]: https://github.com/shakacode/shakapacker/compare/v6.1.1...v6.1.1
+[Unreleased]: https://github.com/shakacode/shakapacker/compare/v6.2.0...master
+[v6.2.0]: https://github.com/shakacode/shakapacker/compare/v6.1.1...v6.2.0
+[v6.1.1]: https://github.com/shakacode/shakapacker/compare/v6.1.0...v6.1.1
 [v6.1.0]: https://github.com/shakacode/shakapacker/compare/v6.0.2...v6.1.0
 [v6.0.2]: https://github.com/shakacode/shakapacker/compare/v6.0.1...v6.0.2
 [v6.0.1]: https://github.com/shakacode/shakapacker/compare/v6.0.0...v6.0.1

data/Gemfile.lock

@@ -1,7 +1,7 @@
 PATH
   remote: .
   specs:
-    shakapacker (6.1.0)
+    shakapacker (6.1.1)
       activesupport (>= 5.2)
       rack-proxy (>= 0.6.1)
       railties (>= 5.2)

data/README.md

@@ -2,8 +2,7 @@
 
 _Official, actively maintained successor to [rails/webpacker](https://github.com/rails/webpacker). Internal naming for `shakapacker` will continue to use `webpacker` where possible for v6. ShakaCode stands behind long-term maintainence and development of this project for the Rails community._
 
-
-* See [V6 Upgrade](./docs/v6_upgrade.md) for upgrading from v5 or prior v6 releases. 
+* See [V6 Upgrade](./docs/v6_upgrade.md) for upgrading from v5 or prior v6 releases.
 
 [![Ruby specs](https://github.com/shakacode/shakapacker/workflows/Ruby%20specs/badge.svg)](https://github.com/shakacode/shakapacker/actions)
 [![Jest specs](https://github.com/shakacode/shakapacker/workflows/Jest%20specs/badge.svg)](https://github.com/shakacode/shakapacker/actions)
@@ -18,13 +17,13 @@ Webpacker makes it easy to use the JavaScript pre-processor and bundler [Webpack
 to manage application-like JavaScript in Rails. It can coexist with the asset pipeline,
 leaving Webpack responsible solely for app-like JavaScript, or it can be used exclusively, making it also responsible for images, fonts, and CSS.
 
-Check out 6.1.0.beta.0 for [SWC](https://swc.rs/) support! It's way faster than babel.
+Check out 6.1.1 for [SWC](https://swc.rs/) and [esbuild-loader](https://github.com/privatenumber/esbuild-loader) support! They are faster than Babel!
 
 See a comparison of [webpacker with jsbundling-rails](https://github.com/rails/jsbundling-rails/blob/main/docs/comparison_with_webpacker.md).
 
-Discussion forums to discuss debugging and troubleshooting tips. Please open issues for bugs and feature requests:
-1. [rails/webpacker discussion forum](https://discuss.rubyonrails.org/c/webpacker/10)
-2. [Discussions tab](https://github.com/shakacode/shakapacker/discussions)
+Discussion forum and Slack to discuss debugging and troubleshooting tips. Please open issues for bugs and feature requests:
+1. [Discussions tab](https://github.com/shakacode/shakapacker/discussions)
+2. [Slack discussion channel](https://reactrails.slack.com/join/shared_invite/enQtNjY3NTczMjczNzYxLTlmYjdiZmY3MTVlMzU2YWE0OWM0MzNiZDI0MzdkZGFiZTFkYTFkOGVjODBmOWEyYWQ3MzA2NGE1YWJjNmVlMGE)
 
 ---
 
@@ -78,12 +77,12 @@ Discussion forums to discuss debugging and troubleshooting tips. Please open iss
 - Yarn
 
 ## Features
-- Rails view helpers that fully support webpack output
+- Rails view helpers that fully support Webpack output, including HMR and code splitting.
 - Convenient but not required webpack configuration. The only requirement is that your webpack configuration create a manifest.
 - HMR with the webpack-dev-server, such as for hot-reloading for React!
 - Automatic code splitting using multiple entry points to optimize JavaScript downloads
-- [Webpack v5](https://webpack.js.org/)
-- ES6 with [babel](https://babeljs.io/)
+- [Webpack v5+](https://webpack.js.org/)
+- ES6 with [babel](https://babeljs.io/), [SWC](https://swc.rs/), or [Esbuild](https://github.com/privatenumber/esbuild-loader)
 - Asset compression, source-maps, and minification
 - CDN support
 - Extensible and configurable. For example, all major dependencies are specified as peers, so you can upgrade easily.
@@ -107,11 +106,10 @@ rails new myapp --skip-javascript
 
 _Note, Rails 6 installs the older v5 version of webpacker unless you specify `--skip-javascript`._
 
-Update your `Gemfile`:
+Add `shakapacker` gem to your `Gemfile`:
 
-```ruby
-# Gemfile
-gem 'shakapacker', '~> 6.0'
+```bash
+bundle add shakapacker --strict
 ```
 
 Then running the following to install Webpacker:
@@ -208,9 +206,18 @@ The result looks like this:
 <%= stylesheet_pack_tag 'map' %>
 ```
 
+However, you may use multiple calls to stylesheet_pack_tag if, say, you require multiple <style> tags for different output media:
+
+``` erb
+<%= stylesheet_pack_tag 'application', media: 'screen' %>
+<%= stylesheet_pack_tag 'print', media: 'print' %>
+```
+
+If you need to setup the pack name args in partials, [see this discussion](https://github.com/shakacode/shakapacker/issues/39).
+
 If you want to link a static asset for `<img />` tag, you can use the `asset_pack_path` helper:
 ```erb
-<img src="<%= asset_pack_path 'images/logo.svg' %>" />
+<img src="<%= asset_pack_path 'static/logo.svg' %>" />
 ```
 
 Or use the dedicated helper:
@@ -369,6 +376,13 @@ console.log(webpackConfig.source_path)
 console.log(JSON.stringify(webpackConfig, undefined, 2))
 ```
 
+You may want to modify rules in the default configuration. For instance, if you are using a custom svg loader, you may want to remove `.svg` from the default file loader rules. You can search and filter the default rules like so:
+
+```js
+const svgRule = config.module.rules.find(rule => rule.test.test('.svg'));
+svgRule.test = svgRule.test.filter(t => !t.test('.svg'))
+```
+
 ### Babel configuration
 
 By default, you will find the Webpacker preset in your `package.json`. Note, you need to use the new NPM package name, `shakapacker`.
@@ -665,7 +679,9 @@ development:
     port: 3035
 ```
 
-If you have `hmr` turned to true, then the `stylesheet_pack_tag` generates no output, as you will want to configure your styles to be inlined in your JavaScript for hot reloading. During production and testing, the `stylesheet_pack_tag` will create the appropriate HTML tags.
+If you have `hmr` turned to true and `inline_css` is not false, then the `stylesheet_pack_tag` generates no output, as you will want to configure your styles to be inlined in your JavaScript for hot reloading. During production and testing, the `stylesheet_pack_tag` will create the appropriate HTML tags.
+
+If you want to have HMR and separate link tags, set `hmr: true` and `inline_css: false`. This will cause styles to be extracted and reloaded with the `mini-css-extract-plugin` loader. Note that in this scenario, you do not need to include style-loader in your project dependencies.
 
 ### Additional paths
 

data/docs/customizing_babel_config.md

@@ -29,7 +29,9 @@ yarn add --dev @pmmmwh/react-refresh-webpack-plugin react-refresh
 module.exports = function (api) {
   const defaultConfigFunc = require('shakapacker/package/babel/preset.js')
   const resultConfig = defaultConfigFunc(api)
+  const isDevelopmentEnv = api.env('development')
   const isProductionEnv = api.env('production')
+  const isTestEnv = api.env('test')
 
   const changesOnDefault = {
     presets: [

data/docs/style_loader_vs_mini_css.md

@@ -0,0 +1,48 @@
+# CSS Delivery In Development
+
+You have two options for serving CSS in development:
+
+1. You can opt to serve CSS via style-loader (as was traditionally done in a Webpack setup), where CSS is written by Javascript served by Webpacker into a `<style>` tag, or
+2. You can opt to serve CSS as a full CSS file via mini-css-extract-plugin, which uses a standard `<link>` tag to load a fully separate CSS file.
+
+Both options support HMR. The default is style-loader. If you want to use mini-css-extract-plugin in development, set `inline_css: false` in the development dev_server section of your webpacker.yml:
+
+```yml
+development:
+  <<: *default
+  dev_server:
+    hmr: true
+    inline_css: false # Use mini-css-extract-plugin for CSS delivery
+```
+
+## Why would I pick style-loader?
+
+style-loader is how you are probably are used to serving CSS in development with HMR in Webpack.
+
+### benefits
+
+* No [Flash Of Unstyled Content (FOUC)](https://en.wikipedia.org/wiki/Flash_of_unstyled_content) on HMR refreshes
+* Smaller/faster incremental updates.
+
+### drawbacks
+
+* Inflated JS deliverable size; requires JS execution before CSS is available
+* FOUC on initial page load
+* Adds an extra dependency
+* Divergence in delivery mechanism from production
+
+## Why would I pick mini-extract-css-plugin?
+
+mini-css-extract-plugin's behavior is much more true to a production deployment's behavior, in that CSS is loaded via `link rel=stylsheet` tags, rather than injected by Javascript into `style` tags.
+
+### benefits
+
+* Required for production, so it's going to be in play anyhow. Using only it simplifies the config and eliminates the style-loader dependency.
+* No FOUC on initial page loads
+* CSS delivered via `<link>` tags matches the mechanism used in production (I have been guilty of omitting my `stylesheet_pack_tag` for my first deploy because CSS worked fine with just the `javascript_pack_tag` in development.)
+
+### drawbacks
+
+* Invokes a separate HTTP request, compared to style-loader
+* Potential for FOUC on HMR refreshes
+* More data transferred per refresh (full stylesheet reload, rather than just an incremental patch). Not likely to be noticed for local development, but still a technical difference. This may only be the case [when you're using local CSS modules](https://github.com/webpack-contrib/mini-css-extract-plugin/blob/master/src/hmr/hotModuleReplacement.js#L267-L273).

data/docs/using_esbuild_loader.md

@@ -24,7 +24,7 @@ To use esbuild as your transpiler today. You need to do two things:
 1. Make sure you've installed `esbuild` and `esbuild-loader` packages.
 
 ```
-yarn add -D esbuild esbuild-loader
+yarn add esbuild esbuild-loader
 ```
 
 2. Add or change `webpacker_loader` value in your default `webpacker.yml` config to `esbuild`

data/docs/using_swc_loader.md

@@ -19,10 +19,10 @@ In order to use SWC as your compiler today. You need to do two things:
 1. Make sure you've installed `@swc/core` and `swc-loader` packages.
 
 ```
-yarn add -D @swc/core swc-loader
+yarn add @swc/core swc-loader
 ```
 
-2. Add or change `webpacker_loader` value in your default `webpacker.yml` config to `swc`
+2. Add or change `webpack_loader` value in your default `webpacker.yml` config to `swc`
 The default configuration of babel is done by using `package.json` to use the file within the `shakapacker` package.
 
 ```yml

data/docs/v6_upgrade.md

@@ -10,16 +10,16 @@ Webpacker used to configure Webpack indirectly, which lead to a [complicated sec
 
 While you have to configure integration with frameworks yourself, [`webpack-merge`](https://github.com/survivejs/webpack-merge) helps with this. See this example for [Vue](https://github.com/shakacode/shakapacker#other-frameworks) and scroll to the bottom for [more examples](#examples-of-v5-to-v6).
 
-## webpacker v6.0.0.rc.6 to shakapacker v6.0.0 
+## webpacker v6.0.0.rc.6 to shakapacker v6.0.0
 See an example migration here: [PR 27](https://github.com/shakacode/react_on_rails_tutorial_with_ssr_and_hmr_fast_refresh/pull/27).
-          
+
 ### Update Steps to v6.0.0 from v6.0.0.rc.6
 _If you're on webpacker v5, follow below steps to get to v6.0.0.rc.6 first._
 
 1. Change the gem name from `webpacker` to `shakapacker` and the NPM package from `@rails/webpacker` to `shakapacker`.
 1. Install the peer dependencies. Run `yarn add @babel/core @babel/plugin-transform-runtime @babel/preset-env @babel/runtime babel-loader compression-webpack-plugin terser-webpack-plugin webpack webpack-assets-manifest webpack-cli webpack-merge webpack-sources webpack-dev-server`
 1. Update any scripts that called `bin/webpack` or `bin/webpack-dev-server` to `bin/webpacker` or `bin/webpacker-dev-server`
-1. Update your webpack config for a single config file, `config/webpack/webpack.config.js`. If you want to use the prior style of having a separate file for each NODE_ENV, you can use this shim for `config/webpack/webpack.config.js`:
+1. Update your webpack config for a single config file, `config/webpack/webpack.config.js`. If you want to use the prior style of having a separate file for each NODE_ENV, you can use this shim for `config/webpack/webpack.config.js`. WARNING, previously, if you did not set `NODE_ENV`, `NODE_ENV` defaulted to `development`. Thus, you might expect `config/webpack/development.js` to run, but you'll instead be using the `config/webpack/RAILS_ENV.js`
    ```js
    const { env, webpackConfig } = require('shakapacker')
    const { existsSync } = require('fs')
@@ -30,11 +30,12 @@ _If you're on webpacker v5, follow below steps to get to v6.0.0.rc.6 first._
      if (existsSync(path)) {
        console.log(`Loading ENV specific webpack configuration file ${path}`)
        return require(path)
-     } else {
-       return webpackConfig
+     } else {                       
+       // Probably an error if the file for the NODE_ENV does not exist
+       throw new Error(`Got Error with NODE_ENV = ${env.nodeEnv}`);
      }
    }
-  
+
    module.exports = envSpecificConfig()
    ```
 1. Update `babel.config.js` if you need JSX support. See [Customizing Babel Config](./customizing_babel_config.md)
@@ -43,26 +44,26 @@ _If you're on webpacker v5, follow below steps to get to v6.0.0.rc.6 first._
 1. Ensure you have a clean working git branch. You will be overwriting all your files and reverting the changes that you don't want.
 
 1. Consider changing from the v5 default for `source_entry_path` in `webpacker.yml`.
-  ```yml
-    source_path: app/javascript
-    source_entry_path: packs
-  ```
-  consider changing to the v6 default:
-  ```yml
-    source_path: app/javascript
-    source_entry_path: /
-  ```
-  Then consider moving your `app/javascript/packs/*` (including `application.js`) to `app/javascript/` and updating the configuration file.
-
-  Note, moving your files is optional, as you can stil keep your entries in a separate directory, called something like `packs`, or `entries`. This directory is defined within the source_path.
+   ```yml
+     source_path: app/javascript
+     source_entry_path: packs
+   ```
+   consider changing to the v6 default:
+   ```yml
+     source_path: app/javascript
+     source_entry_path: /
+   ```
+   Then consider moving your `app/javascript/packs/*` (including `application.js`) to `app/javascript/` and updating the configuration file.
+
+   Note, moving your files is optional, as you can stil keep your entries in a separate directory, called something like `packs`, or `entries`. This directory is defined within the source_path.
 
 1. **Ensure no nested directories in your `source_entry_path`.** Check if you had any entry point files in child directories of your `source_entry_path`. Files for entry points in child directories are not supported by shakacode/shakapacker v6. Move those files to the top level, adjusting any imports in those files.
 
-  The new v6 configuration does not allow nesting, so as to allow placing the entry points at in the root directory of JavaScript. You can find this change [here](https://github.com/rails/webpacker/commit/5de0fbc1e16d3db0c93202fb39f5b4d80582c682#diff-7af8667a3e36201db57c02b68dd8651883d7bfc00dc9653661be11cd31feeccdL19).
+   The new v6 configuration does not allow nesting, so as to allow placing the entry points at in the root directory of JavaScript. You can find this change [here](https://github.com/rails/webpacker/commit/5de0fbc1e16d3db0c93202fb39f5b4d80582c682#diff-7af8667a3e36201db57c02b68dd8651883d7bfc00dc9653661be11cd31feeccdL19).
 
 1. Upgrade the Webpacker Ruby gem and the NPM package
 
-   Note: [Check the gem page to verify the latest version](https://rubygems.org/gems/shakapacker), and make sure to install identical version numbers of `shakapacker` gem and package. (Gems use a period and packages use a dot between the main version number and the beta version.)
+   Note: [Check the gem page to verify the latest version](https://rubygems.org/gems/shakapacker), and make sure to install identical version numbers of `shakapacker` gem and package. (Gems use a hyphen and packages use a dot between the main version number and the beta version.)
 
    Example going to a specific version:
 
@@ -79,35 +80,15 @@ _If you're on webpacker v5, follow below steps to get to v6.0.0.rc.6 first._
    yarn add shakapacker@6.0.0-rc.13 --exact
    ```
 
-  ```bash
-  bundle exec rails webpacker:install
-  ```
-
-  Overwrite all files and check what changed.
-
-  Note, the webpacker:install will install the peer dependencies:
-  ```bash
-  yarn add @babel/core @babel/plugin-transform-runtime @babel/preset-env @babel/runtime babel-loader compression-webpack-plugin terser-webpack-plugin webpack webpack-assets-manifest webpack-cli webpack-merge webpack-sources webpack-dev-server
-  ```
-
-1. There is now a single default configuration file of `config/webpack/webpack.config.js`. Previously, the config file was set
-  to `config/webpack/#{NODE_ENV}.js`. In the `config/webpack/` directory, you can either refactor your code in `test.js`, `development.js`, and `production.js` to a single file, `webpack.config.js` or you can replace the contents of `config/webpack/config.webpack.js` to conditionally load the old file based on the NODE_ENV with this snippet:
-   ```js
-   const { env, webpackConfig } = require('shakapacker')
-   const { existsSync } = require('fs')
-   const { resolve } = require('path')
+   ```bash
+   bundle exec rails webpacker:install
+   ```
 
-   const envSpecificConfig = () => {
-     const path = resolve(__dirname, `${env.nodeEnv}.js`)
-     if (existsSync(path)) {
-       console.log(`Loading ENV specific webpack configuration file ${path}`)
-       return require(path)
-     } else {
-       return webpackConfig
-     }
-   }
+   Overwrite all files and check what changed.
 
-   module.exports = envSpecificConfig()
+   Note, the webpacker:install will install the peer dependencies:
+   ```bash
+   yarn add @babel/core @babel/plugin-transform-runtime @babel/preset-env @babel/runtime babel-loader compression-webpack-plugin terser-webpack-plugin webpack webpack-assets-manifest webpack-cli webpack-merge webpack-sources webpack-dev-server
    ```
 
 1. Review the new default's changes to `webpacker.yml`. Consider each suggested change carefully, especially the change to have your `source_entry_path` be at the top level of your `source_path`.
@@ -135,51 +116,66 @@ _If you're on webpacker v5, follow below steps to get to v6.0.0.rc.6 first._
 
 1. If you are using any integrations like `css`, `postcss`, `React` or `TypeScript`. Please see https://github.com/shakacode/shakapacker#integrations section on how they work in v6.
 
-1. Import `environment` changed to `webpackConfig`. For example, the new code looks like:
+1. `config/webpack/environment.js` was changed to `config/webpack/base.js` and exports a native webpack config so no need to call `toWebpackConfig`.
+   Use `merge` to make changes:
+   
    ```js
-   // config/webpack/webpack.config.js
-   const { webpackConfig, merge } = require('shakapacker')
-   const customConfig = require('./custom')
-
-   module.exports = merge(webpackConfig, customConfig)
+   // config/webpack/base.js
+   const { webpackConfig, merge } = require('@rails/webpacker');
+   const customConfig = {
+     module: {
+       rules: [
+         {
+           test: require.resolve('jquery'),
+           loader: 'expose-loader',
+           options: {
+             exposes: ['$', 'jQuery']
+           }
+         }
+       ]
+     }
+   };
+   
+   module.exports = merge(webpackConfig, customConfig);
    ```
-
+ 
 1. Copy over custom browserlist config from `.browserslistrc` if it exists into the `"browserslist"` key in `package.json` and remove `.browserslistrc`.
 
 1. Remove `babel.config.js` if you never changed it. Configure your `package.json` to use the default:
-  ```json
-  "babel": {
-    "presets": [
-      "./node_modules/shakapacker/package/babel/preset.js"
-    ]
-  }
-  ```
-  See customization example the [Customizing Babel Config](./docs/customizing_babel_config.md) for React configuration.
+   ```json
+   "babel": {
+     "presets": [
+       "./node_modules/@rails/webpacker/package/babel/preset.js"
+     ]
+   }
+   ```
+   See customization example the [Customizing Babel Config](./docs/customizing_babel_config.md) for React configuration.
 
 1. `extensions` was removed from the `webpacker.yml` file. Move custom extensions to your configuration by merging an object like this. For more details, see docs for [Webpack Configuration](https://github.com/shakacode/shakapacker/blob/master/README.md#webpack-configuration)
 
-    ```js
-    {
-      resolve: {
-        extensions: ['.ts', '.tsx', '.vue', '.css']
-      }
-    }
-    ```
-1. In `webpacker.yml`, check if you had `watched_paths`. That is not `additional_paths`.
+   ```js
+   {
+     resolve: {
+       extensions: ['.ts', '.tsx', '.vue', '.css']
+     }
+   }
+   ```
+1. In `webpacker.yml`, check if you had `watched_paths`. That is now `additional_paths`.
 
 1. Some dependencies were removed in [PR 3056](https://github.com/rails/webpacker/pull/3056). If you see the error: `Error: Cannot find module 'babel-plugin-macros'`, or similar, then you need to `yarn add <dependency>` where <dependency> might include: `babel-plugin-macros`, `case-sensitive-paths-webpack-plugin`, `core-js`, `regenerator-runtime`. Or you might want to remove your dependency on those.
 
 1. Review the new default's changes to `webpacker.yml` and `config/webpack`. Consider each suggested change carefully, especially the change to have your `source_entry_path` be at the top level of your `source_path`.
 
-1. Make sure that you can run `bin/webpacker` without errors.
+1. Make sure that you can run `bin/webpack` without errors.
 
 1. Try running `RAILS_ENV=production bin/rails assets:precompile`. If all goes well, don't forget to clean the generated assets with `bin/rails assets:clobber`.
 
 1. Run `yarn add webpack-dev-server` if those are not already in your dev dependencies. Make sure you're using v4+.
 
-1. Update any scripts that called `/bin/webpack` or `bin/webpack-dev-server` to `/bin/webpacker` or `bin/webpacker-dev-server`
+1. In `bin/webpack` and `bin/webpack-dev-server`, The default NODE_ENV, if not set, will be the RAILS_ENV. Previously, NODE_ENV would default to development if not set. Thus, the old bin stubs would use the webpack config corresponding to `config/webpack/development.js`. After the change, if `RAILS_ENV` is `test`, then `NODE_ENV` is `test`. The final 6.0 release changes to using a single `webpack.config.js`.
+
+1. Now, follow the steps above to get to shakapacker v6 from webpacker v6.0.0.rc.6
 
-1. Now, follow the steps above to get to shakapacker v6 from webpacker v6.0.0.rc.6[
 
 ## Examples of v5 to v6
 

data/lib/install/config/webpacker.yml

@@ -8,6 +8,9 @@ default: &default
   cache_path: tmp/webpacker
   webpack_compile_output: true
 
+  # Location for manifest.json, defaults to {public_output_path}/manifest.json if unset
+  # manifest_path: public/packs/manifest.json
+
   # Additional paths webpack should look up modules
   # ['app/assets', 'engine/foo/app/assets']
   additional_paths: []
@@ -18,6 +21,9 @@ default: &default
   # Select loader to use, available options are 'babel' (default), 'swc' or 'esbuild'
   webpack_loader: 'babel'
 
+  # Set to true to enable check for matching versions of shakapacker gem and NPM package - will raise an error if there is a mismatch or wildcard versioning is used
+  ensure_consistent_versioning: false
+
 development:
   <<: *default
   compile: true
@@ -29,6 +35,14 @@ development:
     port: 3035
     # Hot Module Replacement updates modules while the application is running without a full reload
     hmr: false
+    # If HMR is on, CSS will by inlined by delivering it as part of the script payload via style-loader. Be sure
+    # that you add style-loader to your project dependencies.
+    #
+    # If you want to instead deliver CSS via <link> with the mini-extract-css-plugin, set inline_css to false.
+    # In that case, style-loader is not needed as a dependency.
+    #
+    # mini-extract-css-plugin is a required dependency in both cases.
+    inline_css: true
     # Defaults to the inverse of hmr. Uncomment to manually set this.
     # live_reload: true
     client:

data/lib/install/template.rb

@@ -58,10 +58,10 @@ results = []
 Dir.chdir(Rails.root) do
   if Webpacker::VERSION.match?(/^[0-9]+\.[0-9]+\.[0-9]+$/)
     say "Installing shakapacker@#{Webpacker::VERSION}"
-    results << run("yarn add shakapacker@#{Webpacker::VERSION}")
+    results << run("yarn add shakapacker@#{Webpacker::VERSION} --exact")
   else
     say "Installing shakapacker@next"
-    results << run("yarn add shakapacker@next")
+    results << run("yarn add shakapacker@next --exact")
   end
 
   package_json = File.read("#{__dir__}/../../package.json")

data/lib/webpacker/commands.rb

@@ -16,7 +16,7 @@ class Webpacker::Commands
   #   age=600.
   #
   def clean(count = 2, age = 3600)
-    if config.public_output_path.exist? && config.public_manifest_path.exist?
+    if config.public_output_path.exist? && config.manifest_path.exist?
       packs
         .map do |paths|
           paths.map { |path| [Time.now - File.mtime(path), path] }
@@ -57,7 +57,7 @@ class Webpacker::Commands
   private
     def packs
       all_files       = Dir.glob("#{config.public_output_path}/**/*")
-      manifest_config = Dir.glob("#{config.public_manifest_path}*")
+      manifest_config = Dir.glob("#{config.manifest_path}*")
 
       packs = all_files - manifest_config - current_version
       packs.reject { |file| File.directory?(file) }.group_by do |path|

data/lib/webpacker/compiler.rb

@@ -47,7 +47,7 @@ class Webpacker::Compiler
     attr_reader :webpacker
 
     def last_compilation_digest
-      compilation_digest_path.read if compilation_digest_path.exist? && config.public_manifest_path.exist?
+      compilation_digest_path.read if compilation_digest_path.exist? && config.manifest_path.exist?
     rescue Errno::ENOENT, Errno::ENOTDIR
     end
 

data/lib/webpacker/configuration.rb

@@ -23,6 +23,10 @@ class Webpacker::Configuration
     fetch(:compile)
   end
 
+  def ensure_consistent_versioning?
+    fetch(:ensure_consistent_versioning)
+  end
+
   def source_path
     root_path.join(fetch(:source_path))
   end
@@ -35,6 +39,14 @@ class Webpacker::Configuration
     source_path.join(fetch(:source_entry_path))
   end
 
+  def manifest_path
+    if data.has_key?(:manifest_path)
+      root_path.join(fetch(:manifest_path))
+    else
+      public_output_path.join("manifest.json")
+    end
+  end
+
   def public_path
     root_path.join(fetch(:public_root_path))
   end
@@ -43,10 +55,6 @@ class Webpacker::Configuration
     public_path.join(fetch(:public_output_path))
   end
 
-  def public_manifest_path
-    public_output_path.join("manifest.json")
-  end
-
   def cache_manifest?
     fetch(:cache_manifest)
   end

data/lib/webpacker/dev_server.rb

@@ -1,9 +1,9 @@
 class Webpacker::DevServer
   DEFAULT_ENV_PREFIX = "WEBPACKER_DEV_SERVER".freeze
 
-  # Configure dev server connection timeout (in seconds), default: 0.01
+  # Configure dev server connection timeout (in seconds), default: 0.1
   # Webpacker.dev_server.connect_timeout = 1
-  cattr_accessor(:connect_timeout) { 0.01 }
+  cattr_accessor(:connect_timeout) { 0.1 }
 
   attr_reader :config
 
@@ -55,6 +55,15 @@ class Webpacker::DevServer
     fetch(:hmr)
   end
 
+  def inline_css?
+    case fetch(:inline_css)
+    when false, "false"
+      false
+    else
+      true
+    end
+  end
+
   def env_prefix
     config.dev_server.fetch(:env_prefix, DEFAULT_ENV_PREFIX)
   end

data/lib/webpacker/helper.rb

@@ -148,13 +148,6 @@ module Webpacker::Helper
   #   <%= stylesheet_pack_tag 'calendar' %>
   #   <%= stylesheet_pack_tag 'map' %>
   def stylesheet_pack_tag(*names, **options)
-    if @stylesheet_pack_tag_loaded
-      raise "To prevent duplicated chunks on the page, you should call stylesheet_pack_tag only once on the page. " \
-      "Please refer to https://github.com/shakacode/shakapacker/blob/master/README.md#usage for the usage guide"
-    end
-
-    @stylesheet_pack_tag_loaded = true
-
     return "" if Webpacker.inlining_css?
 
     stylesheet_link_tag(*sources_from_manifest_entrypoints(names, type: :stylesheet), **options)

data/lib/webpacker/instance.rb

@@ -36,6 +36,6 @@ class Webpacker::Instance
   end
 
   def inlining_css?
-    dev_server.hmr? && dev_server.running?
+    dev_server.inline_css? && dev_server.hmr? && dev_server.running?
   end
 end