Git Product home page Git Product logo

tsconfig-to-swcconfig's Introduction

tsconfig-to-swcconfig

NPM version NPM downloads

Convert tsconfig to swc config.

Why?

(swc-project/swc#1348)

swc has no plans to support tsconfig.json, but it could be useful in some cases. For example, migrating from tsc to swc in a large project, you can use this tool to convert tsconfig.json to .swcrc, and then modify the .swcrc to make it work.

Install

npm i tsconfig-to-swcconfig

Usage

Convert config in a tsconfig file

import { convert } from 'tsconfig-to-swcconfig'

const swcConfig = convert() // will look for tsconfig under the cwd and convert it to swc config

Advanced options:

import { convert } from 'tsconfig-to-swcconfig'

convert('tsconfig-filename.json', process.cwd(), {
  // more swc config to override...
  minify: true,
})

Convert tsconfig value

Convert tsconfig value directly:

import { convertTsConfig } from 'tsconfig-to-swcconfig'

const swcConfig = convertTsConfig({
  module: 'commonjs',
  target: 'es2018',
  strict: true,
  esModuleInterop: true,
})

Advanced usage:

import { convertTsConfig } from 'tsconfig-to-swcconfig'

const swcConfig = convertTsConfig(
  { target: 'es2018' }, // tsconfig
  { minify: true }, // more swc config to override...
)

CLI

To use the CLI, install globally:

npm i -g tsconfig-to-swcconfig

Then run:

tsconfig-to-swcconfig --help
Usage: tsconfig-to-swcconfig [options]
Alias: t2s [options]

Options:
  -f, --filename <filename>  filename to tsconfig (default: "tsconfig.json")
  -c, --cwd <cwd>            cwd (default: process.cwd())
  -o, --output <output>      output file (default: stdout)
  -s, --set <name>=<value>   set additional swcrc options
  -h, --help                 display help for command

Instead of installing globally, you can also use npx to run the CLI without installing:

npx tsconfig-to-swcconfig -f tsconfig.json -c /path/to/project -o swc.config.js

License

MIT

tsconfig-to-swcconfig's People

Contributors

charlesoconor avatar ihsanmujdeci avatar jbedard avatar songkeys avatar spmiller avatar styfle avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar

tsconfig-to-swcconfig's Issues

Difference between strict and strictMode?

Hey, thanks for making this tool ๐Ÿ‘

But I wondering, what's difference between strict and strictMode? If I used the code below

const swcConfig = convertTsConfig({
  module: 'commonjs',
  target: 'es2015'
})

It generates config below

{
  "sourceMaps": "inline",
  "module": {
    "type": "commonjs",
    "strict": false,
    "strictMode": true,
    "noInterop": true
  },
  "jsc": {
    "externalHelpers": false,
    "target": "es2015",
    "parser": {
      "syntax": "typescript",
      "tsx": true,
      "decorators": false,
      "dynamicImport": true
    },
    "transform": {
      "legacyDecorator": true,
      "decoratorMetadata": false,
      "react": {
        "throwIfNamespace": false,
        "development": false,
        "useBuiltins": false,
        "pragma": "React.createElement",
        "pragmaFrag": "React.Fragment",
        "importSource": "react"
      }
    },
    "keepClassNames": false
  }
}

Why strict: false and strictMode: true? I can't find any documentation about this option... ๐Ÿค•

Thanks,

Consider supporting `extends` property

Hey, thanks for the library.

I might implement this at some point, but it would be great if this library supported the extends property, and followed the compiler rules up the config tree.

Incorrect use of strict

Hi there,

Many thanks for this library. We are attempting to use it to enable our adoption of swc and it has saved us a lot of time so far!

In convertTsConfig, we assign swc config from the tsconfig, setting properties where they don't exist.

The problem occurs when we merge the two configs together here. tsc's definition of strict is not the same as swc's definition, but we merge them as if they are the same.

I think a simple solution would be to remove the copying of the strict setting from the tsconfig, and only set it if passed in via the manually overridden config. Would you accept a PR that did this?

TypeError: _extends.endsWith is not a function in utils.js when using extends property as an array in TypeScript 5+

When using TypeScript 5+ and configuring the tsconfig property "extends" as an array in the tsconfig.json file, the following error is thrown in the utils.js file:

/node_modules/tsconfig-to-swcconfig/dist/utils.js:35
if (!_extends.endsWith('.json')) {
              ^

TypeError: _extends.endsWith is not a function

This error occurs because the code expects "extends" to be a string. In TypeScript 5+, the extends property in the tsconfig.json file can now be a string or an array.

You can see the update here: microsoft/TypeScript#29118

Steps to reproduce:

  1. Use TypeScript 5+
  2. Set the extends property in the tsconfig.json file as an array.
  3. Run the project.

Expected behavior:

The project should run without any errors.

Actual behavior:

The error mentioned above is thrown in the utils.js file.

Possible solution:

This solution is dependent on the desired direction for the package:

1. Manual approach

To address the issue, you can manually check if the extends property is an array or string in the tsconfig.json file. If it is a string, maintain the current behavior. If it is an array, you can do the following:

  1. Iterate through each element in the extends array and attempt to load the corresponding tsconfig.json file.
  2. Merge the tsconfigs deeply, ensuring that the order of the tsconfigs is respected. This means that the first tsconfig is overwritten by subsequent tsconfigs, and the last tsconfig is the one the user provided.
  3. This should resolve the error and produce the expected output.

2. Use typescript

The previous solution may not be future-proof, as it tries to mimic the expected behavior of typescript rather than relying on TypeScript to compile the tsconfig and using the output to generate the swcconfig.

You can rely on TypeScript's inner workings to generate the complete tsconfig without worrying about compiling it, as follows:

import * as ts from 'typescript';

const configFileName = 'tsconfig.json';
const { config, error } = ts.readConfigFile(configFileName, ts.sys.readFile);
if (error) {
    console.error(error);
    process.exit(1);
}

const parsedConfig = ts.parseJsonConfigFileContent(config, ts.sys, './');
const compilerOptions = ts.convertCompilerOptionsFromJson(parsedConfig.options, './', configFileName);

console.log(compilerOptions.options);

This code generates the complete tsconfig as expected, without compiling it manually. You can leverage the inner workings of TypeScript to resolve the tsconfig and then use it to map the swcconfig.

Affected Package:
tsconfig-to-swcconfig

Version:
2.2.0

Platform:

  • Node 18.14
  • Typescript 5.0.4

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.