[▲ Vercel Community](/) · [Categories](/categories) · [Latest](/latest) · [Top](/top) · [Live](/live)

[Feedback](/c/feedback/8)

# Module not found when using #imports

142 views · 0 likes · 2 posts


Piszczu13rk 4271 (@piszczu13rk-4271) · 2025-11-04

I have nextjs app and its build fails when I use `import` property of `package.json` file. Below is a snippet of my error:

```
@piszczj/web:build:    Creating an optimized production build ...
@piszczj/web:build: Failed to compile.
@piszczj/web:build: 
@piszczj/web:build: ./src/app/(app)/account/edit/profile/update-teacher-profile-form.tsx
@piszczj/web:build: Module not found: Can't resolve '@piszczj/files/uploader/triggers/video-trigger'
```

Inside `video-trigger.tsx` I use `#src/…` import and there is no error in vs code and no error when I build this package only, but when building `web` app it throws above error. I forked that repo https://github.com/vercel/turborepo/tree/main/examples/with-tailwind and started to implement my changes which are:

* in `tsconfig.json` of `ui` package I added `    "rootDir": "."`
* In `package.json` of `ui` package I added: 

  ```
    "imports": {
  
      "#src/*": [
  
        "./src/*.ts",
  
        "./src/*.tsx"
  
      ]
  
    },
  ```

   
* in `packages/ui` I added `box.tsx` and `inner-box.tsx` in `src/box` directory, where:

  ```
  import { InnerBox } from "#src/box/inner-box";
  
  
  
  export const Box = () => {
  
    return (
  
      <div>
  
        <InnerBox />
  
      </div>
  
    );
  
  };
  ```
* I added `box` inside `web/app/page.tsx`  importing it as `import { Box } from "@repo/ui/box/box";` 

Now, during the build I have an error:

```
> Build error occurred
Error: Turbopack build failed with 1 errors:
./packages/ui/dist/box/box.js:5:21
Module not found: Can't resolve '#src/box/inner-box'
  3 | exports.Box = void 0;
  4 | const jsx_runtime_1 = require("react/jsx-runtime");
> 5 | const inner_box_1 = require("#src/box/inner-box");
    |                     ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
  6 | const Box = () => {
  7 |     return ((0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)(inner_box_1.InnerBox, {}) }));
  8 | };

```

SO the errors are quite similar, maybe if you can fix that I will be ale to fix the error in my main repo. Any ideas?


Pauline P. Narvas (@pawlean) · 2025-11-14

Could you try replacing your `#src/*` imports with relative imports:

```
// Instead of:
import { InnerBox } from "#src/box/inner-box";

// Use:
import { InnerBox } from "./inner-box";
```

Let us know how you get on!