1. @rollup/plugin-sucrase
Compile TypeScript, Flow, JSX, etc with Sucrase
@rollup/plugin-sucrase
Package: @rollup/plugin-sucrase
Created by: rollup
Last modified: Thu, 05 Oct 2023 12:07:22 GMT
Version: 5.0.2
License: MIT
Downloads: 259,103
Repository: https://github.com/rollup/plugins

Install

npm install @rollup/plugin-sucrase
yarn add @rollup/plugin-sucrase

npm
size
libera manifesto

@rollup/plugin-sucrase

🍣 A Rollup plugin which compiles TypeScript, Flow, JSX, etc with Sucrase.

Requirements

This plugin requires an LTS Node version (v14.0.0+) and Rollup v2.53.1+.

Install

Using npm:

 npm install @rollup/plugin-sucrase --save-dev

Usage

Create a rollup.config.js configuration file and import the plugin. An example of compiling TypeScript (the node-resolve plugin is added to automatically add file extensions, since TypeScript expects not to find them):

 import sucrase from '@rollup/plugin-sucrase';
import resolve from '@rollup/plugin-node-resolve';

export default {
  input: 'src/index.ts',
  output: {
    file: 'dist/bundle.js',
    format: 'cjs'
  },
  plugins: [
    resolve({
      extensions: ['.js', '.ts']
    }),
    sucrase({
      exclude: ['node_modules/**'],
      transforms: ['typescript']
    })
  ]
};

Then call rollup either via the CLI or the API.

Options

The following Sucrase options may be passed as options for this plugin:

  • enableLegacyBabel5ModuleInterop
  • enableLegacyTypeScriptModuleInterop
  • jsxFragmentPragma
  • jsxPragma
  • production
  • transforms

exclude

Type: String | Array[...String]
Default: null

A picomatch pattern, or array of patterns, which specifies the files in the build the plugin should ignore. By default no files are ignored.

include

Type: String | Array[...String]
Default: null

A picomatch pattern, or array of patterns, which specifies the files in the build the plugin should operate on. By default all files are targeted.

Meta

CONTRIBUTING

LICENSE (MIT)

RELATED POST

Enhancing Vue.js Development: Harnessing the Potential of Vue-Loader

Enhancing Vue.js Development: Harnessing the Potential of Vue-Loader

Simplify Data Validation in Vue.js: A Step-by-Step Guide to Using Regex

Simplify Data Validation in Vue.js: A Step-by-Step Guide to Using Regex

Troubleshooting Made Easy: Common Issues and Solutions with vue-loader Without vue-cli

Troubleshooting Made Easy: Common Issues and Solutions with vue-loader Without vue-cli

Optimizing Webpack 4 with Vue CLI 3: Disabling the Cache-Loader

Optimizing Webpack 4 with Vue CLI 3: Disabling the Cache-Loader

Step-by-Step Guide: How to Add a Function to Your Vuex Plugin

Step-by-Step Guide: How to Add a Function to Your Vuex Plugin