openedx / openedx/frontend-build

`webpack.dev.config.js` should be able to refer to use port number in `env.config.js` if provided

Open
#513 0 comments 1 reaction 0 assignees View on GitHub

Nobody has claimed this yet.

Dominant language
JavaScript
Stars
25
Forks
41
Avg merge
3d 14h
Merged PRs (30d)
5

Description

When we eventually move away from using .env configuration files, we'll want to ensure that the webpack.dev.config.js is able to provide the port number from env.config.js.

Currently, the port number for the devserver is determined here, which means that on npm run start it will only ever look at the process.env object for the PORT or it will default to 8080, which isn't ideal for developing with multiple repos running that don't have .env.* files anymore.

To fix this, we would need to figure out a way to bring the port number from env.config.js during runtime in webpack.dev.config.js or require all repos that now use env.config.js to modify the port assignment in their customized webpack dev config.

Example of an MFE with a .env.development AND env.config.js
// ./webpack.dev.config.js

const { createConfig } = require('@edx/frontend-build');

const envConfig = require('./env.config');

const config = createConfig('webpack-dev');

config.devServer.port = envConfig.PORT || process.env.PORT || 8080;

module.exports = config;

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start with config/webpack.dev.config.js and the port assignment referenced in the issue, then compare it with the env.config.js example and the npm run start flow. Determine how the dev server should obtain PORT at runtime and verify that the configured port is used instead of only process.env.PORT or 8080.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript, webpack
Domain
build-system, tooling
Issue type
Feature
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
45/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.