Having frontend in different directory

[tomocrafter]

Hi, thank you for making this great plugin.

I have a couple of questions about the installation.
Before I installed this plugin, I had a Rails+Vue project in root/frontend with package.json and vite.config.ts.
After that, I installed the plugin and rewrote vite.json as follows,

{
  "all": {
    "sourceCodeDir": "frontend",
    "viteBinPath": "frontend/node_modules/.bin/vite",
    "entrypointsDir": "src",
    "watchAdditionalPaths": []
  },
  "development": {
    "autoBuild": true,
    "publicOutputDir": "vite-dev",
    "port": 3036
  },
  "test": {
    "autoBuild": true,
    "publicOutputDir": "vite-test"
  }
}

but I get the following error in bin/vite build.

❯ bin/vite build --clear --mode=development
Could not resolve entry module (index.html).
error during build:
Error: Could not resolve entry module (index.html).
    at error (/root/frontend/node_modules/rollup/dist/shared/rollup.js:5305:30)
    at ModuleLoader.loadEntryModule (/root/frontend/node_modules/rollup/dist/shared/rollup.js:18545:20)
    at async Promise.all (index 0)

Build with Vite failed! ❌

If I create root/index.html, this error disappears, but I cannot use it because the entries are not placed correctly.

How can I put the frontend in a different location than app/frontend?

[ElMassimo]

Hi, it is possible to use a different project structure, but from the error it seems that no entrypoints were provided.

By default entrypointsDir is 'entrypoints', so with the config you shared you should place them in frontend/entrypoints.

---

Would you share your current project structure? It will help to understand how the app is organized.

You can use the tree utility to get the project structure.

[tomocrafter]

Here's project structure.

.
├── app
├── bin
├── config
├── db
├── frontend
│  ├── public
│  ├── src // This gonna be entrypoints
│  ├── tests
│  ├── index.html
│  ├── package.json
│  ├── README.md
│  ├── tsconfig.json
│  ├── vite.config.ts
│  ├── yarn-error.log
│  └── yarn.lock
├── lib
├── log
├── public
├── vendor
├── config.ru
├── docker-compose.yml
├── Gemfile
├── Gemfile.lock
├── package.json
├── Procfile
├── Rakefile
├── README.md
└── yarn.lock

[ElMassimo]

If you want to use app/frontend/index.html as the main file, try setting:

{
  "all": {
    "sourceCodeDir": "frontend",
    "entrypointsDir": ".",

The structure is a bit unusual though, for example, not sure if it's going to work well since the frontend folder has a different package.json.

[tomocrafter]

Thank you!
Yes, It didn't go well, so I put all frontend content to the app/frontend as default of this plugin.