Storybook: Storybook/angular uses wrong tsconfig for TsconfigPathsPlugin

[artaommahe]

Describe the bug
Tsconfig file path, using by storybook/angular TsconfigPathsPlugin here, is

1. taken from angular.json config and ignores .storybook/tsconfig.json
2. even that one from angular.json is wrong and is related to another application in workspace (app1 instead of app2 in example repo)

console.log of cliWebpackConfigOptions.buildOptions.tsConfig shows

projects/app1/tsconfig.json

despite we're running storybook for app2 and have a projects/app2/.storybook/tsconfig.json file

To Reproduce
Steps to reproduce the behavior:

1. clone https://github.com/artaommahe/storybook-tsconfigpaths
2. yarn install
3. yarn start-storybook -c projects/app2/.storybook
4. see an error

ERROR in ./projects/app2/src/app/app.component.ts
Module not found: Error: Can't resolve '@app2/test-module/const' in 'D:\projects\tests\storybook-tsconfigpaths\projects\app2\src\app'    
 @ ./projects/app2/src/app/app.component.ts 3:0-53 6:21-31

1. uncomment in webpack.config.js
2. yarn start-storybook -c projects/app2/.storybook
3. storybook started

Expected behavior
Proper tsconfig path resoltion that respects .storybook/tsconfig.json existing

@storybook/angular@^5.2.5

[gaetanmaisse]

As @artaommahe well said, until now, when starting SB ts-loader uses tsconfig.json from SB config folder and TsconfigPathsPlugin webpack plugin is using tsconfig.json related to the main project of angular.json file.

I made a commit on a branch to use tsconfig.json from SB config folder if it has one tsconfig.json (and it should) and fallback to angular.json related one if it doesn't https://github.com/storybookjs/storybook/commit/686422787c9b397872fee86b5f7e986fe2b9c06c

As we are not using the same tsconfig.json file as before, TS compiler throws new errors and I don't know how to fix them for now.

An other interesting point is that we are continuing to use loaders from projects of angular.json file for styles and CLI related, it's done with @angular-devkit/build-angular here: inhttps://github.com/storybookjs/storybook/blob/b84559e40dc063d06041ccbccb78554e9ca8a5bc/app/angular/src/server/angular-cli_config.js#L109

@kroeder @ndelangen can you take a look at my commit and tell me if it's ok to do something like I did and if you have any idea about the direction we should follow about SB x Angular with multiple (sub) projects?

[ndelangen]

This is too deep into ts + angular land for me to make a judgement on I'm afraid. I'd trust @kroeder's expertise.

[stale[bot]]

Hi everyone! Seems like there hasn't been much going on in this issue lately. If there are still questions, comments, or bugs, please feel free to continue the discussion. Unfortunately, we don't have time to get to every issue. We are always open to contributions so please send us a pull request if you would like to help. Inactive issues will be closed after 30 days. Thanks!

[artaommahe]

nope :/

[CodeByAlex]

Bump

Looks like it might be caused by this line: https://github.com/storybookjs/storybook/blob/2ebcb6c41b23e6f09b6b9db96bfcb38ca30a83ca/app/angular/src/server/angular-cli_config.ts#L73

Is relying on the Angular.json architect build value for ts config and never searches the .storybook directory as an option