Vite: Could not resolve entry module (index.html)

Question

I am new to Openshift 3.11 deployment, I created a Multistage Dockerfile for a React application, the build want correctly on my local machine, but when I run on the openshift cluster I get the error below:

> kncare-ui@0.1.0 build
> tsc && vite build

vite v2.9.9 building for production...
✓ 0 modules transformed.
Could not resolve entry module (index.html).
error during build:
Error: Could not resolve entry module (index.html).
    at error (/app/node_modules/rollup/dist/shared/rollup.js:198:30)
    at ModuleLoader.loadEntryModule (/app/node_modules/rollup/dist/shared/rollup.js:22680:20)
    at async Promise.all (index 0)
error: build error: running 'npm run build' failed with exit code 1

and this is my Dockefile

FROM node:16.14.2-alpine as build-stage      
RUN mkdir -p /app/
WORKDIR /app/
RUN chmod -R 777 /app/
COPY package*.json /app/
COPY tsconfig.json /app/
COPY tsconfig.node.json /app/
RUN npm ci
COPY ./ /app/
RUN npm run build

FROM nginxinc/nginx-unprivileged 
#FROM bitnami/nginx:latest
COPY --from=build-stage /app/dist/ /usr/share/nginx/html
#CMD ["nginx", "-g", "daemon off;"]
ENTRYPOINT ["nginx", "-g", "daemon off;"]
EXPOSE 80

Matt Coady · Answer 1 · 2023-06-08T17:43:29.007

12

Vite uses an html page as an entry point by default. So you either need to create one or if you don't have an html page, you can use it in "library mode".

https://vitejs.dev/guide/build.html#library-mode

From the docs:

// vite.config.js
const path = require('path')
const { defineConfig } = require('vite')

module.exports = defineConfig({
  build: {
    lib: {
      entry: path.resolve(__dirname, 'lib/main.js'),
      name: 'MyLib',
      fileName: (format) => `my-lib.${format}.js`
    },
    rollupOptions: {
      // make sure to externalize deps that shouldn't be bundled
      // into your library
      external: ['vue'],
      output: {
        // Provide global variables to use in the UMD build
        // for externalized deps
        globals: {
          vue: 'Vue'
        }
      }
    }
  }
})

edited Jun 08 '23 at 17:43

answered Jun 13 '22 at 21:34

Matt Coady

3,418
5
38
63

Is there a way to tell it where the html page is and not use library mode? For example if index.html is inside a folder like /public/index.html – Dirk R Jul 04 '23 at 13:49
You're just changing your main entry file. Use the example in their docs for multipage app and just ignore the nested line: https://vitejs.dev/guide/build.html#multi-page-app – Matt Coady Jul 10 '23 at 19:04
In the end I found the best solution was to move my index.html file to the root as per this Issue https://github.com/vitejs/vite/issues/798 – Dirk R Jul 12 '23 at 11:17

score 0 · Answer 2 · answered Feb 17 '23 at 16:24

0

Had same issue because of .dockerignore. Make sure your index.html not ignored. In case if you ignoring everything (**) you can add !index.html to the next line and try.

answered Feb 17 '23 at 16:24

Skill For Kill

1
3

Vite: Could not resolve entry module (index.html)

2 Answers2