bin/shakapacker render correclty but bin/shakapacker-dev-server render nothing

[AlexDemzz]

Hello,
Something very strange appear here.
When i compile with bin/shakapacker, my React is correctly rendered.
But if i start bin/shakapacker-dev-server, my react is not loaded anymore, but i have the files in <script/> and the empty <div id=""/> in my DOM.
The compilation show no errors.

Is this a bug or a bad configuration ?

shakapacker.yml

default: &default
  source_path: app/javascript
  source_entry_path: packs
  nested_entries: true
  css_extract_ignore_order_warnings: false

  public_root_path: public
  public_output_path: assets/packs
  cache_path: tmp/cache/shakapacker
  webpack_compile_output: true
  shakapacker_precompile: true

  additional_paths: ['app/assets', 'app/assets/fonts']

  cache_manifest: false

  webpack_loader: 'babel'
  ensure_consistent_versioning: false
  compiler_strategy: digest
  useContentHash: false

development:
  <<: *default
  compile: true
  compiler_strategy: mtime

  dev_server:

    host: localhost
    port: 3035
    hmr: true
    inline_css: false
    client:
      overlay: true
    compress: true
    allowed_hosts: 'all'
    pretty: true
    headers:
      'Access-Control-Allow-Origin': '*'
    static:
      watch:
        ignored: '**/node_modules/**'

test:
  <<: *default
  compile: true
  public_output_path: packs-test

staging:
  <<: *default
  compile: false

production:
  <<: *default
  compile: false
  useContentHash: true
  cache_manifest: true

development.js

process.env.NODE_ENV = "development";
const { devServer } = require("shakapacker");

const webpackConfig = require("./ServerClientOrBoth");

const developmentEnvOnly = (clientWebpackConfig) => {
const ReactRefreshWebpackPlugin = require("@pmmmwh/react-refresh-webpack-plugin");
clientWebpackConfig.plugins.push(
  new ReactRefreshWebpackPlugin({
    overlay: {
      sockPort: devServer.port,
    },
  })
);
};
module.exports = webpackConfig(developmentEnvOnly);

Setup environment:

• Ruby version: 2.7
• Rails version: 5.2.6
• Shakapacker version: 7.1.0
• React version : 18
• react_on_rails version : 13.4

[ahangarha]

Consider the difference between bin/shakapacker and bin/shakapacker-dev-server. The latter, runs webpack dev-server, which bundles files in memory. It is suitable for the development phase.

For more information, check out:

• dev-server not bundling webpack/webpack-dev-server#24
• Write bundle to disk webpack/webpack-dev-server#62

[Judahmeek]

@AlexDemzz do you have any errors in the browser console?

[AlexDemzz]

@AlexDemzz do you have any errors in the browser console?

No but after some try, now I have a error 500 for a HMR chunk package without more informations.
Have you any idea ?