Docz: ERROR #98123 WEBPACK: Can't resolve 'components'

[Steffi3rd]

Bug Report

I can't run Docz. I have an WEBPACK error.

I have an existing .mdx using this line :

import { PageMDX } from "components";

I have a config which allows me to use directly components instead of ../../components

gatsby-node.js

/* Allow us to use something like: import { X } from 'directory' instead of '../../folder/directory' */
exports.onCreateWebpackConfig = ({ actions }) => {
  actions.setWebpackConfig({
    resolve: {
      modules: [path.resolve(__dirname, 'src'), 'node_modules'],
    },
  });
};

It works using gatsby develop, gatsby build and gatsby serve.
But when I run yarn docz dev, I have this error :

ERROR #98123  WEBPACK

Generating SSR bundle failed

Can't resolve 'components' in '../front/.docz/.cache/caches/gatsby-plugin-mdx/mdx-scopes-dir'

To Reproduce

import { Page } from "components";

<Page>

# Privacy Policy

Lorem ipsum, or lipsum as it is sometimes known, is dummy text used in laying out print, graphic or web designs. The passage is attributed to an unknown typesetter in the 15th century who is thought to have scrambled parts of Cicero's De Finibus Bonorum et Malorum for use in a type specimen book.

</Page>

Expected behavior

Docz should be found components and running.

Environment

• docz version: 2.0.0-rc.71
• OS: macOS 10.14.5
• yarn run v1.16.0

[rakannimer]

Hey

Could you try replacing your gatsby-node.js file with :

gatsby-node.js

/* Allow us to use something like: import { X } from 'directory' instead of '../../folder/directory' */
exports.onCreateWebpackConfig = ({ actions }) => {
  actions.setWebpackConfig({
    resolve: {
      modules: [path.resolve(__dirname, '../src'), 'node_modules'],
    },
  });
};

[Steffi3rd]

Hello @rakannimer!

I tried your solution.

I don't have the error anymore with yarn docz:dev.
But I have new ones :

 ERROR  Failed to compile with 23 errors                 
⠀
error  in ../src/components/Algolia/Algolia.js
⠀
Module Error (from ../node_modules/eslint-loader/index.js):

.../front/src/components/Algolia/Algolia.js
  4:3  error  'React' must be in scope when using JS

And with gatsby develop, gatsby build and gatsby serve, I have this :

ERROR  Failed to compile with 191 errors              
⠀
These dependencies were not found:
⠀
* components in ./src/pages/privacy.mdx, ./src/pages/ventures.js and 35 others

[rakannimer]

Any chance you can provide a small repro so we can debug your problems easier ?

Also could you try replacing :

- modules: [path.resolve(__dirname, '../src'), 'node_modules'],
+ modules: [path.resolve(__dirname, '../src')],

[giovannipds]

I'm suffering with the same when I tried to install docz on a nextjs project...

[rakannimer]

Hey ! I'm sorry to hear that !

Any chance you can share your nextjs project (or tell us more about it) to see what's going wrong and try to help ?

[giovannipds]

Hi! I've ugrade my project packages, installed the unmet peer dependency of webpack@^4.4.0 (resolved to ^4.41.2) and upgraded a single project dependency version (react-bootstrap which was using a beta release 😆) and now docz's running great.

I'm sorry I can't help on this particular issue, I'd say exactly the same, try to separate this issue in a testing repo. Regards!

[stale[bot]]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.