search

jaredpalmer / tsdx

Zero-config CLI for TypeScript package development
https://tsdx.io
MIT License
11.26k stars 508 forks source link

change rootDir to ./src cause trouble for storybook custom `/.storybook/config.ts` with require.context (Storybook <5.3) #641

Closed zhaoyao91 closed 4 years ago

zhaoyao91 commented 4 years ago

Current Behavior

after receiving the warning to tell me changge the rootDir to ./src, the stroybook does not work no longer.

ERROR in /Users/bytedance/workspace/use-pick-files/tsconfig.json
[tsl] ERROR
      TS6059: File '/Users/bytedance/workspace/use-pick-files/.storybook/config.ts' is not under 'rootDir' '/Users/bytedance/workspace/use-pick-files/src'. 'rootDir' is expected to contain all source files.

ERROR in /Users/bytedance/workspace/use-pick-files/tsconfig.json
[tsl] ERROR
      TS6059: File '/Users/bytedance/workspace/use-pick-files/stories/use-pick-files.stories.tsx' is not under 'rootDir' '/Users/bytedance/workspace/use-pick-files/src'. 'rootDir' is expected to contain all source files.

Expected behavior

storybook works after changing the rootDir

Suggested solution(s)

Additional context

Your environment

Software Version(s)
TSDX 0.13.0
TypeScript 3.8.3
Browser chrome
npm/Yarn yarn 1.21.1
Node 12.14.1
Operating System mac os
agilgur5 commented 4 years ago

Poop, thought this might be an issue after working on #638 which is very similar, but this is on the Storybook side, not the TSDX side. Was mentioned in https://github.com/jaredpalmer/tsdx/issues/440#issuecomment-601896367 .

Currently working on it but I think there's a workaround that seems to be safe, which is to use:

{
  "rootDirs": ["./src", "./stories", "./.storybook"]
}

Storybook seems to recommend a similar set-up

zhaoyao91 commented 4 years ago

@agilgur5 confirmed, workaround works well! this may be integrated into the template of react with storybook, to avoid having to search the issue for new projects.

agilgur5 commented 4 years ago

That's great, thanks for confirming!

I did a lot of research and there's some discussion in #638, which is closely related to this -- there will be some changes to the templates, but I'm not sure if we'll use this specific one yet; we might be able to work it out a different way. I still need to test what's possible with Storybook, as that's not something I looked into yet (#638 is about tests) and I also don't use it in any of my libraries at all yet, so I'm not really familiar with it.

agilgur5 commented 4 years ago

So I tried reproducing this and was unable to do this with react-with-storybook template.

The Storybook config you're using in use-pick-files is quite different than the template. I was able to reproduce it with your config.

agilgur5 commented 4 years ago

Ah, I figured it out -- your configuration is for Storybook 5.2 -- the templates use 5.3 (as of TSDX v0.13), which is a big change. In 5.3 you don't need require.context at all, you should use the stories: config with a glob in main.js.

See the Storybook 5.3 migration guide or TSDX's newer templates

zhaoyao91 commented 4 years ago

@agilgur5 thanks for help this is the original repo