Consider a very simple application with the project structure
-- package.json
-- webpack.config.js
-- src
|---index.js
|---runner.js
The index.js
takes in command line arg to require a file, at runtime. Here is index.js:
function requireAtRuntime(filename){
const runner = require(filename);
runner.run()
}
var filename = process.argv[2];
requireAtRuntime(filename);
runner.js
function run(){
console.log("hello world");
}
exports.run = run
package.json
contains the script:
//
scripts :{
"start" : "node src/index.js ./runner.js"
}
These start scripts work well. Now the issue is if I want to webpack index.js
, runner.js
is not included as its dependency and the bundle throws the error when I try to run
node dist/main.js path/to/runner.js
Error: Cannot find module 'path/to/runner.js'
How do I build my webpack so that it can too take a filename as a command line argument and require it during runtime (or store it somewhere)?
CodePudding user response:
We need to provide some kind of hint to webpack around what all files may be dynamically required. Lets assume we have multiple runners. We need to put all of them in a folder like shown below
-- package.json
-- webpack.config.js
-- src
|---index.js
|---runners
|---runner1.js
|---runner2.js
Now we need to change the requireAtRuntime()
function.
index.js
:
function requireAtRuntime(filename){
const runner = require(`./runners/${filename)`);
runner.run()
}
var filename = process.argv[2];
requireAtRuntime(filename);
This will make webpack to fetch all the files in runners and bundle them during compile time.
Now we can run it as
node src/index.js runner1/2
(before bundling) or
node dist/main.js runner1/2
(after bundling)