aleclarson / vite-tsconfig-paths

Support for TypeScript's path mapping in Vite
MIT License
1.28k stars 45 forks source link

Support jsconfig.json #22

Closed aleclarson closed 7 months ago

beforan commented 2 years ago

For now, you can use a tsconfig.json in your js only project.

all jsconfig.json really does (for vs code, at least) is implicitly set allowJs: true and disable errors relating to actual typescript compilation.

I've found the following tsconfig.json to work fine to enable this plugin in a js only project:

{
  "compilerOptions": {
    // this is implicitly set in a `jsconfig.json` so we have to do it manually here
    "allowJs": true,

    "outDir": "dist", // this essentially disables the compilation errors by telling vs code where files would be put if it were to compile (which it won't because this isn't a real typescript project)

    // Do these as normal to your liking for your project
    "baseUrl": "src",
    "paths": {
      "*": ["src/*"]
    }
  },

  // only treat files in here as js source (thus ignoring `node_modules` and your fake output directory above)
  "include": ["src"]
}
aleclarson commented 2 years ago

Released in v3.5.0

huyhoang160593 commented 1 year ago

How does this work ? My project use this and it not working as intended :(

aleclarson commented 1 year ago

@huyhoang160593 What plugin version are you using? Might be a regression in v4

aleclarson commented 1 year ago

I can confirm it's a v4 regression. We're using tsconfck now to find tsconfig files, and it doesn't support jsconfig files yet. @dominikg said that a PR would be welcome.

https://github.com/dominikg/tsconfck

aleclarson commented 1 year ago

/cc @MichaelDeBoey you might be interested in adding this to tsconfck? no worries if you don't :)

MichaelDeBoey commented 1 year ago

@aleclarson I currently don't have the bandwidth to look into that unfortunately

huyhoang160593 commented 1 year ago

@aleclarson the thing is that I'm using the version 3.2.5 of vite :(. After debug only the tsconfig.json is load. But even with tsconfig load the path still not working :(. Was using Window 11 is one of the source of the problem :((((

ibqn commented 1 year ago

It is pity that there is a regression on that. @huyhoang160593 it was working on windows 11 as well for me at least in version 3.6.0 in this exemplary project https://github.com/ibqn/beni-15-puzzle

"vite-tsconfig-paths": "^3.6.0"
huyhoang160593 commented 1 year ago

It is pity that there is a regression on that. @huyhoang160593 it was working on windows 11 as well for me at least in version 3.6.0 in this exemplary project https://github.com/ibqn/beni-15-puzzle

"vite-tsconfig-paths": "^3.6.0"

It seem like in your jsconfig.json there is no "path" been defined? This plugin is basically doing nothing with your project for now

ibqn commented 1 year ago

@huyhoang160593 I use it for global importing i.e. for example

import { App } from 'app'
import 'index.css'
diego-hourly commented 8 months ago

Hello hello! Is there a chance to get the jsconfig.json support back? Maybe using cosmiconfig is possible? For now I got to convert the file to tsconfig.json and add some attributes. (I'm migrating from react-scripts to vite)

{
  "compilerOptions": {
    "allowJs": true,
    "noEmit": true,
    "baseUrl": "src",
    "jsx": "react"
  },
  "include": ["src"]
}

Leaving it here maybe someone needs something similar. allowJs and noEmit make it equivalent from react-scripts' jscofig.json

UPDATE: NVM just realized `tsconfck already supports jsconfig.json since version 3. https://github.com/dominikg/tsconfck/pull/132 Any chance to get that version bump?

aleclarson commented 8 months ago

@diego-hourly It's not simply a version bump. Since we use tsconfck for file discovery and it doesn't support searching for both tsconfig.json and jsconfig.json at the same time, we'll have to settle for either double-crawling or a new option that lets you (the plugin user) override the default configName with "jsconfig.json" in your Vite config (which means, tsconfig.json files wouldn't be used). At first glance, the double-crawling approach seems the best DX with a hopefully negligible performance hit. Nowhere in the near future will I have time to investigate whether double-crawling is a viable solution or not, so it's up to the community.

dominikg commented 8 months ago

tsconfck 3 with its new async cache is a lot faster (60-100 times faster!) than tsconfck 2. So even with a double crawl it would be an improvement. But either way in regular projects users won't notice, there are just not enough files/directories for it to make a difference.

The real question is what you would do with the result of a double crawl. Typescript itself uses tsconfig.json by default and you can tell it about jsconfig.json with a cli flag. To my knowledge, its not defined how precedence is handled in a scenario where there are mixed jsconfig.json and tsconfig.json files, so the easy solution here is to follow typescripts lead and make the config name configurable. If you allow both simultaneously, it would be your responsibility to check which one is closer to the input file, tsconfck does not offer a hybrid mode (and has no plans to, unless typescript itself made that move)

aleclarson commented 7 months ago

Support for jsconfig.json released in v4.3.0

diego-hourly commented 7 months ago

Thank you! @aleclarson