https://github.com/hyrious/esbuild-plugin-code-tag

Strip code tag functions and dedent strings
https://github.com/hyrious/esbuild-plugin-code-tag

Last synced: 15 days ago
JSON representation

Strip code tag functions and dedent strings

• Host: GitHub
• URL: https://github.com/hyrious/esbuild-plugin-code-tag
• Owner: hyrious
• Created: 2022-08-31T05:21:27.000Z (about 2 years ago)
• Default Branch: main
• Last Pushed: 2022-08-31T05:24:35.000Z (about 2 years ago)
• Last Synced: 2024-10-10T16:42:05.513Z (about 1 month ago)
• Language: TypeScript
• Size: 31.3 KB
• Stars: 0
• Watchers: 2
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
## @hyrious/esbuild-plugin-code-tag

This plugin strips [code tags](https://github.com/fregante/code-tag) from your source code.

### Install

```

npm add -D code-tag @hyrious/esbuild-plugin-code-tag

```

### Usage

```js

const { build } = require("esbuild");

const { codeTag } = require("@hyrious/esbuild-plugin-code-tag");

build({

  entryPoints: ["src/index.ts"],

  bundle: true,

  format: "esm",

  plugins: [codeTag()],

}).catch(() => process.exit(1));

```

### Options

```js

codeTag({

  filter: /\.(m?ts|[jt]sx)$/,

  tags: ["html", "css", "gql", "graphql", "md", "markdown", "sql"],

  dedent: [],

});

```

**filter** (default: `/\.(m?ts|[jt]sx)$/`)

A RegExp passed to [`onLoad()`](https://esbuild.github.io/plugins/#on-load) to

match source codes, it is recommended to set a custom filter to skip files

for better performance. By default it does not process .{js,mjs} files.

**tags** (default: `["html", "css", "gql", "graphql", "md", "markdown", "sql"]`)

An array of tags to be stripped. For example if you set `tags` to `["html", "css"]`,

the following transform will happen:

```js

console.log(html`

  
Title

  
hello, world!

`);

```


becomes

```js

console.log(`

  
Title

  
hello, world!

`);

```


**dedent** (default: `[]`)

Template literals after these tags will be [de-indented](https://github.com/tamino-martinius/node-ts-dedent).

For example if you set `dedent` to `["html", "css"]`, the following transform will happen:

```js

console.log(html`

  
Title

  
hello, world!

`);

```


becomes

```js

console.log(`
Title

hello, world!
`);

```


By default `dedent` is empty, so that the default behavior will be the same as

not having this plugin.

### Caveats

- It does not support nested code tags, i.e.

  ```js

  const fragment = html`

    

      ${css`

        body {

          color: red;

        }

      `}

    

  `;

  ```

  If you need to write code like above, you can move inner strings to another scope:

  ```js

  const style = css`

    body {

      color: red;

    }

  `;

  const fragment = html`${style}<style>`;

  ```

## License

MIT @ [hyrious](https://github.com/hyrious)