Import all the different icon files from Icons folder in vue js

userQnyh 0
Viewed 24

I want to import all the icon files from Icons folder, Is there a better way to do it.

Folder structure:

 icon/icons/
             homeIcon.js
             BarIcon.js
             ArrowIcon.js
             ArrowUpIcon.js
             ArrowDownIcon.js
             .....

and then importing it this way:

import { icons } from "../icon/icons";

and then after importing all the files I want to save them in a variable like this:

const allIcons = { type: "select", options: Object.keys(icons) };

and then display in the templates or loop through it. Is there any better way to do it as the above does not work for me. Any help is much Appreciated ! Thanks!

file import vue.js javascript html
1 Answers

create /icon/icons/index.js where you export all files:

export * as home from `./homeIcon`;
...

or -> depends of your icon files export

export { default as home } from `./homeIcon`;
...

then:

import * as icons from "../icon/icons"; /* loads your index.js containing  all the subfile modules */
// handle your module object 'icons' how you want
wendt880
Related