Our team develops a bunch of JavaScript browser apps. These apps share functionality (core) and Web Components (shared). The folder structure is:
/apps
/app-1
/app-2
...
/core
/shared
Each folder contains a src folder.
Considering using snowpack in the folder app-1 I want to reference js files in /core/src or /shared/src both for development (using snowpack dev) and packaging (using snowpack build)
- is this possible?
- are there best practices how to achieve this?
- are there examples for such a situation (or a similar one)
What I tried:
Step 1: I used paths like this: ../../core/src/router.js. This didn't work, maybe because the resources were outside of the webroot of the test server (snowpack dev).
Step 2: I created two symlinks:
apps/app-1/src/@core -> ../../../core/src
apps/app-1/src/@shared -> ../../../shared/src
Now the local server found all the resources. The build process however found only those files, that were direct children of core/src or shared/src, but not any file within a subfolder as e.g. shared/src/component/filter.js.
Any ideas or thoughts?
Appendix
The snowpack.config.json of app-1:
{
"devOptions": {
"port": 8082,
"open": "none"
},
"mount": {
"public": "/",
"src": "/_dist_"
},
"plugins": [
"@snowpack/plugin-babel",
"@snowpack/plugin-dotenv",
"@snowpack/plugin-sass"
]
}
Example for import in app-1/src/handler:
import { loadRoute } from '../@core/router' // works fine
import '../@shared/component/filter' // does not work
// or:
import { loadRoute } from '../@core/router.js' // works fine, too
import '../@shared/component/filter.js' // does not work neither
You should be able to specify a relative path to the folder in your
mountobject as another key:this should serve your files from the
shareddirectory from the/_dist_folder.