Vue.js - How to loop through a folder

Question

I have a Vue SPA app. Now I want to extend this app with app modules so I thought to make a folder src/modules that contain the modules folders. I want to put at the root of each folder some configuration js files (store.js, route.js, and so on). The question is: in the main files (src/store/index.js, src/router/index.js, etc.), how can I loop for every folder in src/modules and check if some configuration file exists to add its content at the main config? Of course this operation should be executed at build time, modules install is not intended to be dynamically. Thanks a lot

Hmm, maybe using a build tool like Webpack or a shell script of some kind? — user115014
– user115014, Commented Oct 27, 2022 at 9:20
@user115014 I don't want to use a shell script, I prefer to use javascript inside main files. Could you answer the question with the way to achive the solution with webpack? Thank you. — Neo710
– Neo710, Commented Oct 27, 2022 at 9:27
Check how to access the filesystem from a stand point of a Node.js app (using fs mainly or readFileSync etc). Frontend cannot really scan local folders, just use static paths hardcoded as far as I know. — kissu
– kissu, Commented Oct 27, 2022 at 10:41

IVO GELOV · Accepted Answer · 2022-10-27 11:06:53Z

1

You can use require.context

const configurations = require.context('./modules', true, /config\.js$/i);
configurations.keys().forEach(filename =>
{
  console.log(filename);
  // file contents will be inside configurations[filename]
});

answered Oct 27, 2022 at 11:06

IVO GELOV

14.3k1 gold badge21 silver badges30 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

NicolaM94 Over a year ago

Hi there! Follow up question: how do you read the content of the file? Trying to console log contents[filename] gives undefined

IVO GELOV Over a year ago

@NicolaM94 Do you have a reproduction, e.g. on CodeSandbox or similar ?

NicolaM94 Over a year ago

I don't unfortunately, but I solved by populating an array with configurations.keys().map(configurations) (I needed to iterate over json files. I'm starting to learn JS and all of this seems really confusing hahahaha. Thank's for the help nevertheless!

IVO GELOV Over a year ago

Yes, this is the example from the Webpack documentation

Collectives™ on Stack Overflow

Vue.js - How to loop through a folder

1 Answer 1

4 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

4 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related