Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Parsing non TS/JS files giving error #19

Closed
NajamShehzad opened this issue May 30, 2024 · 2 comments
Closed

Parsing non TS/JS files giving error #19

NajamShehzad opened this issue May 30, 2024 · 2 comments

Comments

@NajamShehzad
Copy link

NajamShehzad commented May 30, 2024

I encountered an issue while working with the project where non-JavaScript or TypeScript files are being parsed, leading to errors.
Here are the details:

File: C:\Users\Admin\Desktop\WorkingFiles\react-rsbuild\src\tools\generate-components-output-file\windws.ps1:1:1

  × Module parse failed:
  ╰─▶   × JavaScript parsing error: Expected ';', '}' or <eof>
         ╭─[1:1]
       1 │ $rootPath = "test_root_path" # Set your components root folder path here
         ·                              ─
       2 │ $outputFile = "test_root_path" # Set your output file path here
         ╰────
  help:
        You may need an appropriate loader to handle this file type.

It tries to parse all files, including PDFs, text files, and PS1 scripts, within the src folder. I also tried to exclude the tools folder, but it still attempts to parse these files.

image

I'm not even using these files in the code but they still get pick up and being process

@NajamShehzad
Copy link
Author

Here's the link of example repo: https://github.com/NajamShehzad/storybook-rsbuild

@fi3ework
Copy link
Member

Here's the correct config as documented (https://github.com/rspack-contrib/storybook-rsbuild#error-caused-by-bundling-unexpected-files). source.exclude won't work here, as it's only for jsx|tsx files, it still lacks loaders for txt and ps files. We will support webpackInclude magic comment for Rspack to resolve this issue in the future.

import type { StorybookConfig } from 'storybook-react-rsbuild'
import { join, dirname, extname } from 'path'
import { mergeRsbuildConfig } from '@rsbuild/core'

/**
 * This function is used to resolve the absolute path of a package.
 * It is needed in projects that use Yarn PnP or are set up within a monorepo.
 */
function getAbsolutePath(value: string): any {
  return dirname(require.resolve(join(value, 'package.json')))
}

const config: StorybookConfig = {
  stories: ['../src/**/*.mdx', '../src/**/*.stories.@(js|jsx|mjs|ts|tsx)'],
  addons: [
    getAbsolutePath('@storybook/addon-onboarding'),
    getAbsolutePath('@storybook/addon-links'),
    getAbsolutePath('@storybook/addon-essentials'),
    getAbsolutePath('@chromatic-com/storybook'),
    getAbsolutePath('@storybook/addon-interactions'),
  ],
  framework: {
    name: getAbsolutePath('storybook-react-rsbuild'),
    options: {},
  },
  docs: {
    autodocs: 'tag',
  },
  rsbuildFinal: (config) => {
    if (!config.source) {
      config.source = {}
    }

    return mergeRsbuildConfig(config, {
      tools: {
        rspack: (config, { addRules, appendPlugins, rspack, mergeConfig }) => {
          return mergeConfig(config, {
            plugins: [
              new rspack.IgnorePlugin({
                checkResource: (resource, context) => {
                  // for example, ignore all markdown files
                  const absPathHasExt = extname(resource)
                  if (absPathHasExt === '.txt' || absPathHasExt === '.ps1') {
                    return true
                  }

                  return false
                },
              }),
            ],
          })
        },
      },
    })

    return config
  },
  typescript: {
    reactDocgen: 'react-docgen',
    check: true,
  },
}

export default config

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants