Skip to content

Instantly share code, notes, and snippets.

@mnedzka
Forked from aleclarson/rollup-typescript.md
Created August 12, 2020 09:35
Show Gist options
  • Save mnedzka/27062608a8aa6164cb7d3eb29e6e7f69 to your computer and use it in GitHub Desktop.
Save mnedzka/27062608a8aa6164cb7d3eb29e6e7f69 to your computer and use it in GitHub Desktop.

Revisions

  1. @aleclarson aleclarson revised this gist Aug 10, 2020. 1 changed file with 1 addition and 1 deletion.
    2 changes: 1 addition & 1 deletion rollup-typescript.md
    Original file line number Diff line number Diff line change
    @@ -1,4 +1,4 @@
    <sup>Please <a href="https://twitter.com/alecdotbiz/status/1291742610374131712">retweet</a> if this helps you!</sup>
    > Please [retweet](https://twitter.com/alecdotbiz/status/1291742610374131712) if this helps you!
    ### Features

  2. @aleclarson aleclarson revised this gist Aug 10, 2020. 1 changed file with 2 additions and 0 deletions.
    2 changes: 2 additions & 0 deletions rollup-typescript.md
    Original file line number Diff line number Diff line change
    @@ -1,3 +1,5 @@
    <sup>Please <a href="https://twitter.com/alecdotbiz/status/1291742610374131712">retweet</a> if this helps you!</sup>

    ### Features

    🔥 *Blazing fast* builds
  3. @aleclarson aleclarson revised this gist Aug 7, 2020. 1 changed file with 1 addition and 1 deletion.
    2 changes: 1 addition & 1 deletion rollup-typescript.md
    Original file line number Diff line number Diff line change
    @@ -3,7 +3,7 @@
    🔥 *Blazing fast* builds
    😇 CommonJS bundle
    🌲 `.mjs` bundle
    `.d.ts` bundle
    `.d.ts` bundle + type-checking
    🧐 Source maps

    ### Install
  4. @aleclarson aleclarson revised this gist Aug 7, 2020. 1 changed file with 1 addition and 1 deletion.
    2 changes: 1 addition & 1 deletion rollup-typescript.md
    Original file line number Diff line number Diff line change
    @@ -15,7 +15,7 @@
    2. Run this in your terminal:

    ```sh
    pnpm i rollup rollup-plugin-esbuild rollup-plugin-dts -D
    pnpm i esbuild rollup rollup-plugin-esbuild rollup-plugin-dts -D
    wget -O rollup.config.js https://gist.github.com/aleclarson/9900ed2a9a3119d865286b218e14d226/raw/rollup.config.js
    ```

  5. @aleclarson aleclarson revised this gist Aug 7, 2020. 1 changed file with 11 additions and 3 deletions.
    14 changes: 11 additions & 3 deletions rollup-typescript.md
    Original file line number Diff line number Diff line change
    @@ -16,7 +16,7 @@

    ```sh
    pnpm i rollup rollup-plugin-esbuild rollup-plugin-dts -D
    wget -O rollup.config.js ...
    wget -O rollup.config.js https://gist.github.com/aleclarson/9900ed2a9a3119d865286b218e14d226/raw/rollup.config.js
    ```

    3. Ensure your `tsconfig.json` contains these values:
    @@ -27,12 +27,20 @@
    }
    ```

    4. Ensure your `package.json` contains these values:
    4. Ensure your `package.json` contains these values (and replace the `my-lib` part):

    ```json
    "main": "dist/my-lib.js",
    "module": "dist/my-lib.mjs",
    "typings": "dist/my-lib.d.ts",
    ```

    5. Change the `input: 'src/index.ts'` line in `rollup.config.js` if needed.
    5. Change the `input: 'src/index.ts'` line in `rollup.config.js` if needed.

    6. All done! Now do `yarn rollup -c` to build, or add this to your `package.json`:

    ```json
    "scripts": {
    "build": "rollup -c"
    }
    ```
  6. @aleclarson aleclarson created this gist Aug 7, 2020.
    38 changes: 38 additions & 0 deletions rollup-typescript.md
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,38 @@
    ### Features

    🔥 *Blazing fast* builds
    😇 CommonJS bundle
    🌲 `.mjs` bundle
    `.d.ts` bundle
    🧐 Source maps

    ### Install

    1. Install [`pnpm`] or replace the `pnpm i` part with Yarn or NPM.

    [`pnpm`]: https://github.com/pnpm/pnpm#readme

    2. Run this in your terminal:

    ```sh
    pnpm i rollup rollup-plugin-esbuild rollup-plugin-dts -D
    wget -O rollup.config.js ...
    ```

    3. Ensure your `tsconfig.json` contains these values:

    ```json
    "compilerOptions": {
    "target": "esnext"
    }
    ```

    4. Ensure your `package.json` contains these values:

    ```json
    "main": "dist/my-lib.js",
    "module": "dist/my-lib.mjs",
    "typings": "dist/my-lib.d.ts",
    ```

    5. Change the `input: 'src/index.ts'` line in `rollup.config.js` if needed.
    24 changes: 24 additions & 0 deletions rollup.config.js
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,24 @@
    import dts from 'rollup-plugin-dts'
    import esbuild from 'rollup-plugin-esbuild'

    const name = require('./package.json').main.replace(/\.js$/, '')

    const ext = format =>
    format == 'dts' ? 'd.ts' : format == 'cjs' ? 'js' : 'mjs'

    const bundle = format => ({
    input: 'src/index.ts',
    output: {
    file: `${name}.${ext(format)}`,
    format: format == 'cjs' ? 'cjs' : 'es',
    sourcemap: format != 'dts',
    },
    plugins: format == 'dts' ? [dts()] : [esbuild()],
    external: id => !/^[./]/.test(id),
    })

    export default [
    bundle('es'), //
    bundle('cjs'),
    bundle('dts'),
    ]