Unknown compiler option 'jsxImportSource' issue..

[leekeunhwan]

Question

Hi

I want to use docz

Unknown compiler option 'jsxImportSource' and
same issue occurs

As you use twin.macro in your project, in tsconfig 'jsxImportSource'
I am using it by setting it to '@emotion/react'.

The above issue occurred and the build is not working, is there any solution?

I tried to change appTsConfig in doczrc, but it doesn't work.

I am also wondering if there is a way to operate it with a separate tsconfig or if there is a plug-in that can solve it.

[adbayb]

Same with the importsNotUsedAsValues TS config 😅 .

The root cause comes from the fact that the TypeScript runtime is specified as a direct dependency inside the docz-core package and is pretty old (3.5.3 vs the latest 4.3.5: jsxImportSource was introduced in 4.1).

@pedronauck Could we imagine to have typescript specified as a peer dependency? The config is defined consumer side and depends on the TypeScript version specified by the consumer. It would sense to do so (and will also avoid multiple typescript copies in the project :) )

[leekeunhwan]

@pedronauck How are we going to solve this problem?
I want to use Docz soon

[renatobenks]

Thank you for the report guys! We're currently working to fully upgrade everything inside docz but we try can manage a quick fix to that earlier, and typescript is not a peer-dependency, we need it to build processes. But we'll figure a way out to fix that ASAP.

[adbayb]

@renatobenks Is it feasible to specify typescript as a devDependency? If yes, typescript will be available for your development needs (build process) without impacting consumer (dev dependencies are ignored while npm install consumer side).

[renatobenks]

Yes, totally! Let me check, because it should be as dev-dependency 🤔

[renatobenks]

However @adbayb, npm install actually install dev dependencies as well, as long as it's not with the —-prod within

[adbayb]

@renatobenks npm (or whatever node package manager) will install devDependencies of a given package when the package.json of this package is available locally in the current working directory (unless you set the --prod flag as you mentioned).
However if the package is retrieved from a remote location (npm registry, git repository...), the prod flag is implicitly set (ie. no need to set it consumer side) and npm will only install the package dependencies (ignoring its devDependencies).

So, here:

• If you run yarn install in the docz monorepo (local/dev environment) => local package case => devDependencies/dependencies will be installed => docz maintainer happy (build process) 😄
• If a consumer runs yarn add docz in their application => remote location case => dependencies will be installed only => consumers happy (only one copy of TypeScript within the project) 😄

[renatobenks]

Oh, I see what you mean now, sorry! 😅

Sure thing, can you send a PR and see what it got?

[renatobenks]

I'll be working on a few issues on docz today, so let me know @adbayb.

[adbayb]

@renatobenks Unfortunately not today but I can try to book some time tomorrow

[renatobenks]

Awesome! I just advise you to make sure that both rollup and lerna will keep working as properly because maybe, just maybe, that's why typescript is not a dev-dependency as it should.

[adbayb]

@renatobenks and @pedronauck : done ✅ Review needed #1647 🙏