Skip to content

missing section on parcel #35

@tonyhallett

Description

@tonyhallett

Parcel by default runs these transformers
https://github.com/parcel-bundler/parcel/blob/v2/packages/configs/default/index.json
"*.{js,mjs,jsm,jsx,es6,cjs,ts,tsx}": [
"@parcel/transformer-babel",
"@parcel/transformer-js",
"@parcel/transformer-react-refresh-wrap"
]

From https://parceljs.org/languages/typescript/

TSC is the official TypeScript compiler from Microsoft. While Parcel’s default transpiler for TypeScript is much faster than TSC, you may need to use TSC if you are using some configuration in tsconfig.json that Parcel doesn't support. In these cases, you can use the @parcel/transformer-typescript-tsc plugin by adding it to your .parcelrc.
.parcelrc:
{
"extends": "@parcel/config-default",
"transformers": {
"*.{ts,tsx}": ["@parcel/transformer-typescript-tsc"]

and from https://github.com/parcel-bundler/parcel/blob/v2/packages/transformers/typescript-tsc/src/TSCTransformer.js

It uses the typescript tranpileModule api

    interface TranspileOptions {
        compilerOptions?: CompilerOptions;
        fileName?: string;
        reportDiagnostics?: boolean;
        moduleName?: string;
        renamedDependencies?: MapLike<string>;
        transformers?: CustomTransformers;
        jsDocParsingMode?: JSDocParsingMode;
    }

function transpileModule(input: string, transpileOptions: TranspileOptions): TranspileOutput;

Note that there are no transformers made available.

  async transform({asset, config, options}) {
    let [code, originalMap] = await Promise.all([
      asset.getCode(),
      asset.getMap(),
    ]);

    let transpiled = typescript.transpileModule(
      code,
      ({
        compilerOptions: {
          // React is the default. Users can override this by supplying their own tsconfig,
          // which many TypeScript users will already have for typechecking, etc.
          jsx: typescript.JsxEmit.React,
          ...config,
          // Always emit output
          noEmit: false,
          // Don't compile ES `import`s -- scope hoisting prefers them and they will
          // otherwise compiled to CJS via babel in the js transformer
          module: typescript.ModuleKind.ESNext,
          sourceMap: Boolean(asset.env.sourceMap),
          mapRoot: options.projectRoot,
        },
        fileName: asset.filePath, // Should be relativePath?
      }: TranspileOptions),
    );

So for parcel you would need to create a custom typescript transformer, or use @parcel/transformer-typescript-tsc in conjunction with ts-patch persistent-patch installed in advance.
ts-patch patches createProgram so as to invoke which facilitates program transformers and source transformers.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions