My app is a simple monorepo structured like so:

root/
|--package.json
|--shared/
  |--configs/
    |--.eslintrc.js
    |--tsconfig.json
  |--types/
  |--ui-components/
|--project1/
   |--src/
      |--App.vue
      |--main.ts
   |--.eslintrc.js
   |--package.json
   |--project1.code-workspace
   |--tsconfig.json
   |--vue.config.js
|--project2/
   |--src/
      |--App.vue
      |--main.ts
   |--.eslintrc.js
   |--package.json
   |--project2.code-workspace
   |--tsconfig.json
   |--vue.config.js

I’ve been trying to use npm “workspaces” to compile the subproject’s NPM packages up into the root in the hopes I could run each project from the root with something like “cd project2 && npm start” or “npm start –prefix project2”.

Both methods result in this error:

Module not found: Error: Can't resolve './src/main.js' in '/Users/foobar/code/myapp/project2'

So is there a way to have all my NPM packages and configs in the root dir, and run each app (in those sub dirs).

Is there a native way to do this, where my root dir contains all my configs (or base configs which are extended downstream) like my package.json, vue.configs.js, .eslingrc, tsconfig ect but I can serve and build each projects in the subdirs or do I need something like Lerna?

Should my app look like this?

root/
|--package.json
|--.eslintrc.js
|--tsconfig.json
|--vue.config.js
|--shared/
  |--types/
  |--ui-components/
|--project1/
   |--src/
      |--App.vue
      |--main.ts
|--project2/
   |--src/
      |--App.vue
      |--main.ts