Module not found: Can't resolve '@your-org/core-lib' in next js? #169

naveennsit · 2021-07-15T08:07:28Z

naveennsit
Jul 15, 2021

I am new in monorepo or yarn workspace .So learning I follow this starter boilerplate

https://github.com/belgattitude/nextjs-monorepo-example

I forked the above example .And run yarn command on root folder .Initially I got this error
Couldn't find package "@your-org/core-lib@workspace:*"

I resolved above error by using version instead of *
I resolve above error like this

 "@your-org/ui-lib": "3.1.2",
  "@your-org/core-lib": "3.2.2",

instead of

"@your-org/ui-lib": "workspace:*",
"@your-org/core-lib": "workspace:*",

Then when I run yarn my all packages are installed on root directory.when I move inside directory using cd apps/blog-app and run yarn dev .my application run perfectly and show the first page.

NOTE : I don't start anything like example ui-lib and core-lib.but when I change anything on core-lib .it automatically reflecting .Not sure how it is happening without watch or build command. ??

Now I create a new nextjs app in apps folder.
I used this command yarn create next-app --typescript with a name of new-app.
but when I run yarn dev it is successfully build and run .but I am trying to use this "@your-org/core-lib" package in my new app .I am getting module not found error.

I have already used yarn add @your-org/core-lib in new-app directory not on root directory but this still getting same error
Module not found: Can't resolve '@your-org/core-lib' ?

"dependencies": {
    "next": "11.0.1",
    "react": "17.0.2",
    "react-dom": "17.0.2",
    "@your-org/core-lib": "3.2.2"
  }

I am using like this

import Head from 'next/head'
import Image from 'next/image'
import styles from '../styles/Home.module.css'
import { sayHello } from '@your-org/core-lib';

export default function Home() {
  return (
    <div className={styles.container}>
      <Head>
        <title>Create Next App</title>
        <meta name="description" content="Generated by create next app" />
        <link rel="icon" href="/favicon.ico" />
      </Head>
 <ul>
          <li>{`Foo says: ${sayHello('World')} from @your-org/core-lib`}</li>
        </ul>
    

     
    </div>

here is my whole code
https://replit.com/@naveennsit/nextjs-monorepo-example#apps/new-app/pages/index.tsx

kindly suggest where I am doing wrong ?

belgattitude · 2021-07-15T20:51:56Z

belgattitude
Jul 15, 2021
Maintainer

I forked the above example .And run yarn command on root folder

could you try yarn install ? There might be subtle differences and I'm not sure about them. At least our github actions works with it as well as in local for me.

I resolved above error by using version instead of *

Try to keep workspace:* stated in your deps as a starting point... it's a new protocol (see yarn doc about it, not that it exists in pnpm too). Without it you'll probably have to be more cautious with local (workspace) versions and possible published ones.

I don't start anything like example ui-lib and core-lib.but when I change anything on core-lib .it automatically reflecting...

Yes that's the idea 😄 , if you want to know why... it's explained in the readme, number 7.

Now I create a new nextjs app in apps folder.
I used this command yarn create next-app --typescript with a name of new-app.
but when I run yarn dev it is successfully build and run .but I am trying to use this "@your-org/core-lib" package in my new app .I am getting module not found error.

Be sure to take a look at the readme. Important files are next.config.js and tsconfig.json.

5 replies

naveennsit Jul 15, 2021
Author

Thanks for reply . I will take a look . but After posting question I go through code again .I understand little bit .
using tsconfig.json . you alias package . so you directly picked the files from packages/core-lib/src/index . is it correct statement ?
"paths": { "@/test-utils": ["../config/jest/test-utils"], "@/components/*": ["./components/*"], "@your-org/ui-lib/*": ["../../../packages/ui-lib/src/*"], "@your-org/ui-lib": ["../../../packages/ui-lib/src/index"], "@your-org/core-lib/*": ["../../../packages/core-lib/src/*"], "@your-org/core-lib": ["../../../packages/core-lib/src/index"] } },

In next.config.js you are compiling those files. is it correct statement

// @link https://github.com/vercel/next.js/pull/13542 const resolvedBaseUrl = path.resolve(config.context, '../../'); config.module.rules = [ ...config.module.rules, { test: /\.(tsx|ts|js|jsx|json)$/, include: [resolvedBaseUrl], use: defaultLoaders.babel, exclude: (excludePath) => { return /node_modules/.test(excludePath); }, }, ];

what is the use of next-transpile-modules ? I googled it but not able to understand much.
const withTM = require('next-transpile-modules')(tmModules, { resolveSymlinks: true, debug: false, });

naveennsit Jul 16, 2021
Author

last how workspace:* will work at the time of build ? what I understand workspace:* will ignore remote version only concentrate on local workspace file . For developement it is ok . my concern was at the time of build ?
will it compile all file shared files and put in bundle js? so what is benefit of doing versioning in shared component.

sorry may be these questions are silly

belgattitude Jul 16, 2021
Maintainer

Long thread 😄 .

I won't answer all. You don't have to publish, it's optional and has only value if you need to use some libs in other repos

belgattitude Jul 16, 2021
Maintainer

Most of your questions are in the readme. Have a look

naveennsit Jul 16, 2021
Author

sure thanks ..man

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Module not found: Can't resolve '@your-org/core-lib' in next js? #169

{{title}}

Replies: 1 comment 5 replies

{{title}}

{{editor}}'s edit

{{editor}}'s edit

{{title}}

{{title}}

{{title}}

{{editor}}'s edit

{{editor}}'s edit

{{title}}

{{title}}

Select a reply

Module not found: Can't resolve '@your-org/core-lib' in next js? #169

naveennsit Jul 15, 2021

Replies: 1 comment · 5 replies

belgattitude Jul 15, 2021 Maintainer

naveennsit Jul 15, 2021 Author

naveennsit Jul 16, 2021 Author

belgattitude Jul 16, 2021 Maintainer

belgattitude Jul 16, 2021 Maintainer

naveennsit Jul 16, 2021 Author

naveennsit
Jul 15, 2021

Replies: 1 comment 5 replies

belgattitude
Jul 15, 2021
Maintainer

naveennsit Jul 15, 2021
Author

naveennsit Jul 16, 2021
Author

belgattitude Jul 16, 2021
Maintainer

belgattitude Jul 16, 2021
Maintainer

naveennsit Jul 16, 2021
Author