[tutor-dev] [BUG] webpack.dev.config.js overrides existing file for some MFEs

[ARMBouhali]

As I'm running the nightly flavor of tutor, mainly for feature testing and contribution, I have a recurring issue with the provided webpack.dev.config.js.

When webpack.dev.config.js gets mounted on MFE dev containers, it replaces any existing file of the same name in some MFE codebases. The pre-existing config differs from app to app, and it's not possible to cover them with a single patch placeholder (mfe-webpack-dev-config)

Example: MFE apps branched for olive which have a webpack.dev.config.js

frontend-app-gradebook
frontend-app-publisher
frontend-app-ora-grading
frontend-app-communications
frontend-app-program-console
frontend-app-learner-dashboard
frontend-app-library-authoring

I'm preparing a fix which consists of 3 steps:

• 1. Rename webpack.dev.config.js to avoid overwriting any existing configuration. For example, let's give it the name webpack.dev-tutor.config.js.
• 2. Edit webpack.dev-tutor.config.js to use webpack.dev.config.js from the MFE code when it exists, instead of the one from @edx/frontend-build.

// webpack.dev-tutor.config.js: replacing line 3
const fs = require('fs');

const baseDevConfig = fs.existsSync('./webpack.dev.config.js') ? require('./webpack.dev.config.js') : require('@edx/frontend-build/config/webpack.dev.config.js');

• 3. Specify webpack.dev-tutor.config.js as an alternative configuration source at runtime. (and this is where I am stuck)

We are trying to append the option --config ./webpack.dev-tutor.json to webpack-dev-server run using 'npm start'
So we edit the plugin's Dockerfile CMD for dev images:

CMD ["npm", "run", "start"]

becomes

CMD ["npm", "run", "start", "--config", "./webpack.dev-tutor.config.js"]

The start script from package.json:
"start": "fedx-scripts webpack-dev-server --config --progress"

The problem have is that npm start eats the --config option an leaves the ./webpack.dev-tutor.json which is simply ignored by webpack-dev-server

I hope some webpack or UNIX guru could assist me in completing that part.

[ARMBouhali]

I've found some comments on this npm issue (#3136) mentioning the use of --- before any command options, so I tried it and it worked for me.

The non-working command: npm start --config ./webpack.dev-tutor.json
The command with ---: npm start --- --config ./webpack.dev-tutor.json

The PR should be coming shortly.

[regisb]

Thanks for the detailed report @ARMBouhali. Do you happen to know whether this issue also affects the Nutmeg release (tutor-mfe v14)? I see that the gradebook is included in your list of affected MFEs, and the gradebook is supposed to work with the tutor-mfe plugin.

[ARMBouhali]

@regisb The issue affects microfrontends run in dev environment so no issue with nutmeg when run in production.
However if anybody happens to run for example the gradebook app using tutor dev, they would face the same issue since overwriting webpack.dev.config.js is the root cause.

[ARMBouhali]

@regisb the PR is out.