Do you have suggestions? This is the folder structure I defined
.
├── examples // NOTE: flow examples/
│ └── test.json
├── public // NOTE: public assets served at "resources/<package-name>/"/
│ └── vue.png
├── src/
│ ├── nodes/
│ │ └── {node-type}/
│ │ ├── client/
│ │ │ ├── locales/
│ │ │ │ ├── labels/
│ │ │ │ │ ├── en-US.json
│ │ │ │ │ └── de.json
│ │ │ │ └── docs/
│ │ │ │ ├── en-US.html
│ │ │ │ └── de.md
│ │ │ ├── icons/
│ │ │ │ └── vue.png
│ │ │ ├── Form.vue
│ │ │ └── index.js
│ │ └── server/
│ │ └── index.js
│ ├── index.client.ts // OPTIONAL -> if not provided, the cli creates it
│ └── index.server.ts // OPTIONAL -> if not provided, the cli creates it
└── package.json
I decided to group by node-type for the following reasons:
- use the folder name as a single source of truth for defining the node type at build time.
- enable node distribution separately. Each node can be built, packed and published separately.
The result distro is as follows
All files from the "public" folder is added to "dist/resources".
"dist/index.html" is generated at build time.
"dist/locales/{language}" is generated after combining each node type locales. Labels are namespaced by the {node-type}.
Assets you import in your client modules are bundled together if a "Loader" for its mime type is configured in vite. For example, one of my nodes imported an image and used it on its Form.vue
As you can see in the image above, you can also use assets from the "public" folder by just using "/" followed by the name of the file. These assets are not bundled and they will be copied to "dist/resources".