While building the gatsby project, I faced this kind of error.

yarn develop

 ERROR #98123  WEBPACK

Generating development JavaScript bundle failed

Cannot find module 'sanitize.css/page.css'
Require stack:
- D:\UpworkJobs\Nate\dci-gatsby-importexport\node_modules\postcss-normalize\dist\index.cjs.js

File: src\css\preview.css

failed Building development bundle - 366.725s

Here is a screenshot of the error log.

These kinds of errors occur even if I removed all CSS codes from the style files. It seems importing CSS files is not working. If I didn't import the CSS files, the errors go away.

Here are all codes of gatsby-config.js

let systemvars = false;
if (process.env.NODE_ENV === "production") {
  systemvars = true;
}
require("dotenv").config({
  path: `.env.${process.env.NODE_ENV}`,
  systemvars
});
// Gatsby automatically sets NODE_ENV to `development` or `production` when running `gatsby develop` or `gatsby build`, respectively.
// Thus make sure you have .env.development or .env.production setup (unless your CI/build env vars are already set globally)

const AliasConfig = require("./alias.config.js");

module.exports = {
  siteMetadata: {
    title: `DCI DigiGuide Print`,
    description: `DCI DigiGuide Printable Version`,
    author: `@designbycosmic`,
    siteUrl: process.env.SITE_URL,
  },
  plugins: [
    //
    // * App Functionality Plugins
    //

    // eslint plugin
    {
      resolve: "gatsby-plugin-eslint",
      options: {
        test: /\.js$|\.jsx$/,
        exclude: /(node_modules|.cache|public)/,
        stages: ["develop"],
        options: {
          maxWarnings: undefined,
          emitWarning: true,
          failOnError: false,
          failOnWarning: false,
        },
      },
    },

    // allows content to be placed in head
    `gatsby-plugin-react-helmet`,
    // adds web manifest for some pwa functionality
    {
      resolve: `gatsby-plugin-manifest`,
      options: {
        name: `gatsby-dci-digiguide-print`,
        short_name: `DigiGuidePrint`,
        start_url: `/`,
        background_color: `#222c47`,
        theme_color: `#222c47`,
        display: `minimal-ui`,
        icon: `./src/images/favicon.png`, // This path is relative to the root of the site.
      },
    },
    // allow alias imports
    {
      resolve: "gatsby-plugin-alias-imports",
      options: {
        alias: AliasConfig.map,
        extensions: AliasConfig.extensions,
      },
    },
    // inline svgs instead of converting them to base64
    {
      resolve: "gatsby-plugin-react-svg",
      options: {
        rule: {
          include: /svg/,
        },
      },
    },
    `gatsby-plugin-postcss`,
    `gatsby-plugin-material-ui`,
    // Craft CMS configuration
    {
      resolve: `gatsby-source-graphql`,
      options: {
        url: process.env.CRAFT_API_URL,
        typeName: "Craft",
        fieldName: "craft",
        headers: {
          Authorization: `bearer ${process.env.CRAFT_API_TOKEN}`,
        },
      },
    },

    // Get build date
    {
      resolve: `gatsby-plugin-build-date`,
      options: {
        formatAsDateString: false,
      },
    },
  ],
};

Help me to solve this problem.

CodePudding user response：

Finally, this problem has been solved.
Using yarn instead of using npm solved the problem.
Remove node_modules and yarn install
After that, the problem has gone away.
Thank you.