Nuxt•7mo ago

Dockerized Nuxt3 with Bun Cannot find module "@vue/reactivity"

Ive been trying to resolve this issue for the past 5+ hours. And I tracked it far enough to be sure that this is Buns fault. Running all this with node throws no errors. I am trying to Dockerize my Nuxt app and run it with the latest version of bun. On page load I get the following error. This specifically only happens when I run Nuxt as dev. Production works fine. Why docker for dev environment? Ease of development as this repo has many other puzzles. I cannot find anything online about this. Here is my Dockerfile:

ARG NODE_IMAGE=oven/bun:latest
FROM $NODE_IMAGE AS base
WORKDIR /usr/src/app

FROM base AS dependencies
COPY package.json bun.lockb ./
RUN bun install

FROM base AS development
COPY --from=dependencies /usr/src/app/node_modules ./node_modules
COPY . .

ENV NODE_ENV=development
ENV HOST=0.0.0.0
EXPOSE 3000

ENTRYPOINT ["bun", "run", "dev"]

ARG NODE_IMAGE=oven/bun:latest
FROM $NODE_IMAGE AS base
WORKDIR /usr/src/app

FROM base AS dependencies
COPY package.json bun.lockb ./
RUN bun install

FROM base AS development
COPY --from=dependencies /usr/src/app/node_modules ./node_modules
COPY . .

ENV NODE_ENV=development
ENV HOST=0.0.0.0
EXPOSE 3000

ENTRYPOINT ["bun", "run", "dev"]

13 Replies

PatriciusOP•7mo ago

Another interesting detail is this:

nuxt_client  | Nuxt 3.12.1
nuxt_client  | 84 |         "file:///Users/user/Documents/Repositories/Enterprise_Nuxt_Template/clien
nuxt_client  |              ^
nuxt_client  | warn: Non-relative path "file:///Users/user/Documents/Repositories/Enterprise_Nuxt_Template/client/.nuxt/nuxt-mail" is not allowed when "baseUrl" is not set (did you forget a leading "./"?)
nuxt_client  |    at /usr/src/app/.nuxt/tsconfig.json:84:9

nuxt_client  | Nuxt 3.12.1
nuxt_client  | 84 |         "file:///Users/user/Documents/Repositories/Enterprise_Nuxt_Template/clien
nuxt_client  |              ^
nuxt_client  | warn: Non-relative path "file:///Users/user/Documents/Repositories/Enterprise_Nuxt_Template/client/.nuxt/nuxt-mail" is not allowed when "baseUrl" is not set (did you forget a leading "./"?)
nuxt_client  |    at /usr/src/app/.nuxt/tsconfig.json:84:9

This gets only thrown at the same time I experience this issue. Defining baseUrl inside of my tsconfig does not help.

Smef•7mo ago

Can you try this with 3.11? I've seen a lot of people reporting issus with modules from 3.12

PatriciusOP•7mo ago

Okay I tried 3.10 and 3.11, the issue persists. I want to add, that the issue is unlikely to have arrived from my own doing, as from "/usr/src/app/@vue/runtime-core" gets mentioned, right? I have installed some modules which definitely use vues reactivity, but its all @nuxt modules.

Smef•7mo ago

Cool. Checking 3.11 was a good thing to do, since there seemed to be some issues with 3.12, so we can eliminate 3.12 as the source of the problem

PatriciusOP•7mo ago

Do you want to recreate this issue? It should be pretty simple, just create a new Nuxt3 template with bunx and dockerize it with my Dockerfile In case it works on your system, I will look over my package.json and find the troublemaker

Smef•7mo ago

I'm probalby not the best person to help you with that part. I don't use Docker very much Do doing diagnosis on your config would be tough 😛

PatriciusOP•7mo ago

Yeah :sadcatangry:

PatriciusOP•7mo ago

I found the cause of this issue. It was this node_module: https://github.com/modernice/vue-i18n-modules The issue happens in the file "./packages/vue-i18n-modules/src/extension.ts" at line 1 and 2. Any ideas why this only happens to Bun when ran in Docker?

GitHub

GitHub - modernice/vue-i18n-modules: Lazy-loaded, namespaced messag...

Lazy-loaded, namespaced messages for vue-i18n. Contribute to modernice/vue-i18n-modules development by creating an account on GitHub.

PatriciusOP•7mo ago

It's a nuxt module for lazy loading i18n modules. It uses it's vue package, thats where the following code is:

import { ref } from '@vue/runtime-core'
import { computed } from '@vue/reactivity'

import { ref } from '@vue/runtime-core'
import { computed } from '@vue/reactivity'

handshake•7mo ago

so you're using bun over node? just curious, if you use node, does this still happen?

PatriciusOP•7mo ago

It does not, nodeJS works fine.

handshake•7mo ago

seems that you're not the only one https://github.com/oven-sh/bun/issues/3771 and also https://github.com/oven-sh/bun/issues/4743 idk if they're experiecing the same module issue, but it definitely looks like there was issues with nuxt + bun for a minute... also just curious, but what if you created a "temp directory"? Just thinking that instead of overriding your parent directory, you could use a temp one (e.g. /temp/dev)

RUN mkdir -p /temp/dev
COPY package.json bun.lockb /temp/dev/

RUN mkdir -p /temp/dev
COPY package.json bun.lockb /temp/dev/

and then you'd update

FROM base AS development
COPY --from=dependencies /temp/dev/node_modules ./node_modules # <-- update this dir
COPY . .

FROM base AS development
COPY --from=dependencies /temp/dev/node_modules ./node_modules # <-- update this dir
COPY . .

PatriciusOP•7mo ago

This issue got solved, I needed to uninstall @modernice/nuxt-i18n-modules library.

Gaming

Programming

Dockerized Nuxt3 with Bun Cannot find module "@vue/reactivity"