vuejs / vitepress

Vite & Vue powered static site generator.
https://vitepress.dev
MIT License
12.47k stars 2.03k forks source link

Vitepress can't resolve @theme/index import in a node module when run in a docker container #2154

Open Arturexe opened 1 year ago

Arturexe commented 1 year ago

Describe the bug

I'm trying to set up vitepress in a docker container and so far the markdown is available through the routes:

enter image description here

but when I try to run vitepress (routing to index.html), it throws this error:

enter image description here

which indicates that there is a problem with resolving an import. It might be caused by the @ in the import. At this point I'm not sure how @ is treated inside of node modules. I would assume that it's not a alias placeholder. Any idea how to approach this issue?

Reproduction

-

Expected behavior

-

System Info

MacOS Ventura 13.2.1
Vue: 3.2.47
Vite: 4.1.4
Vitepress: 1.0.0-alpha.63

Additional context

No response

Validations

brc-dd commented 1 year ago

Can you share the dockerfile and docker-compose.yml?

Arturexe commented 1 year ago

docker/vitepress/Dockerfile:

FROM node:16

EXPOSE 9000

WORKDIR /var/www/html

ADD docker/vitepress/cmd/startnode startnode

RUN install -m 0755 startnode /usr/local/bin

# production mode
#CMD ["node_modules/serve/bin/serve.js", "-s", "-l", "8080", "dist/"]
# local mode
CMD startnode

docker/docker-compose.yml:

version: "3"

services:
  nginx:
    build:
      context: ../.
      dockerfile: ./docker/nginx/Dockerfile
    ports:
      # 5173 is the port exposed to the Docker Host
      # 443 is the port other bridged Docker Container can access the Service
      - "5173:443"
    volumes:
      - "..:/var/www/html:delegated"
      - "trinity-ui-vite-mnt:/var/run"
    networks:
      trinity-ui-vite-bridge:
        aliases:
          - trinity-ui-vite.local
  vite:
    build:
      context: ../.
      dockerfile: ./docker/vite/Dockerfile
    volumes:
      - "..:/var/www/html:delegated"
      - "trinity-ui-vite-mnt:/var/run"
    networks:
      trinity-ui-vite-bridge:
        aliases:
          - trinity-ui-vite.local

  vitepress:
    build:
      context: ../.
      dockerfile: ./docker/vitepress/Dockerfile
    volumes:
      - "..:/var/www/html:delegated"
      - "trinity-ui-vite-mnt:/var/run"
    networks:
      trinity-ui-vite-bridge:
        aliases:
          - trinity-ui-vite.local

networks:  
  trinity-ui-vite-bridge: null
volumes:
  trinity-ui-vite-mnt: null

We have 3 containers in the frontend cluster:

  1. nginx container to manage routing and communication with the backend
  2. vite for our main app
  3. vitepress for the documentation of our main app
brc-dd commented 1 year ago

Is build working?

Arturexe commented 1 year ago

It builds the .vitepress/dist folder with seemingly correct files inside but when I navigate anywhere in the

https://localhost:5173/vitepress

route, I get the same error.

webartoli commented 7 months ago

I had a similar issue with the vitepress-plugin-mermaid addon.

I've solved creating a theme file in .vitepress/theme/index.ts as documented.

I don't need a particular theme so I've just extended the default without any changes.

// Given from https://vitepress.dev/guide/extending-default-theme

import DefaultTheme from 'vitepress/theme'
export default DefaultTheme

the @theme is probably a typescript alias pointing to .vitepress/theme folder on your source code.

Jlnvv-tom commented 7 months ago

I had a similar issue too, The reason for the.vitepress/theme, indeed. thank you, webartoli.