Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Update bin/webpack-dev-server with ENV value #2629

Conversation

justin808
Copy link
Contributor

Setting an ENV value allows one to easily setup up config/webpack/development.js so that it can build a separate client bundle separately from a server bundle. Only the client bundle should get sent to the webpack-dev-server.

Here is an example configuration that would use this env value.

config/webpack/development.js

process.env.NODE_ENV = process.env.NODE_ENV || "development";

const environment = require("./environment");
const merge = require("webpack-merge");

// Replace
// module.exports = environment.toWebpackConfig()

const clientConfig = environment.toWebpackConfig();

const serverConfig = merge(environment.toWebpackConfig(), {
  mode: "development",
  target: "web",
  entry: "./app/javascript/bundles/hello-world-bundle-server.js",
  output: {
    filename: "hello-world-bundle-server.js",
    path: environment.config.output.path,
    globalObject: "this",
  },
  optimization: {
    minimize: false,
  },
});

serverConfig.plugins = serverConfig.plugins.filter(
  (plugin) => plugin.constructor.name !== "WebpackAssetsManifest"
);

// For HMR, we need to separate the the client and server webpack configurations
if (process.env.WEBPACK_DEV_SERVER) {
  module.exports = clientConfig;
} else if (process.env.SERVER_BUNDLE_ONLY) {
  module.exports = serverConfig;
} else {
  module.exports = [clientConfig, serverConfig];
}

@justin808 justin808 changed the title Update webpack-dev-server Update bin/webpack-dev-server with ENV value Jun 14, 2020
@justin808
Copy link
Contributor Author

@jakeNiemiec and @gauravtiwari Let me know if you think this would be good to include in the gem. While this could be added manually, it seems that we need some way to allow conditional logic in development.js to know if the code is run on the bin/webpack-dev-server.

@gauravtiwari
Copy link
Member

Hi @justin808 Seems like it's already supported? webpack/webpack-dev-server#1929

@justin808
Copy link
Contributor Author

@gauravtiwari brilliant! I never thought to check! How did you know to check that?

@gauravtiwari
Copy link
Member

No problem, I just googled if there is another way to check that the webpack-dev-server is running - got a few hits ^^

@justin808 justin808 deleted the justin808/env-value-for-webpack-dev-server branch June 22, 2020 04:08
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants