fake-tag

fake-tag

A fake template literal tag to trick syntax highlighters, linters and formatters into action. Interpolations and escapes are tested.

Setup

To install with npm, run:

npm install fake-tag

API

function fakeTag

A fake template literal tag that doesn’t do anything except return the tagged template string. Import and use the fake tag with the required name, e.g. gql.

Parameter	Type	Description
literals	Array	Template string literals.
expressions	…*	Template string expressions.

Returns: string — The tagged template string.

Examples

How to import.

import fakeTag from 'fake-tag';

How to require.

const fakeTag = require('fake-tag');

Tagging a GraphQL SDL string with gql.

import gql from 'fake-tag';

const typeDefs = gql`
  "A foo."
  type Foo {
    "The \`Foo\` ID."
    id: ID!
  }
`;

FAQ

Why not comment tags?

A comment tag looks like this:

const QUERY = /* GraphQL */ `
  {
    foo
  }
`;

They are far superior to a fake tag:

• No dependency to manage.
• No inconvenient imports.
• No bundle size bloat.
• No runtime overhead.

Unfortunately not all tools support them yet. prettier has since v1.13.0, but eslint-plugin-graphql at v3.1.0 still doesn’t.

Why not String.raw?

This may be temptingly simple:

const gql = String.raw;
const QUERY = gql`
  {
    foo
  }
`;

However, it doesn’t unescape characters. For the usage example, if you console.log(typeDefs) before and after replacing the import with const gql = String.raw you will see the difference in the type description markdown:

    "A foo."
    type Foo {
-     "The `Foo` ID."
+     "The \`Foo\` ID."
      id: ID!
    }

Changelog

3.0.0

Major

• Updated Node.js support to ^12.20 || >= 14.13.
• Updated browser support to the Browserslist query > 0.5%, not OperaMini all, not IE > 0, not dead.
• Updated dev dependencies, some of which require newer Node.js versions than were previously supported.
• Added a package exports field.
• Refactored the published module to use more modern ES language features.
• The tests are now ESM in an .mjs file instead of CJS in a .js file.
• Use JSDoc comments and jsdoc-md in package scripts to generate a new “API” readme section. The published module now contains JSDoc comments, which might affect TypeScript projects.

Patch

• Updated dev dependencies.
• Add Node.js to the package browserslist field query.
• Updated GitHub Actions CI config:
  • Also run on pull request.
  • Run tests with Node.js v12, v14, v16.
  • Updated actions/checkout to v2.
  • Updated actions/setup-node to v2.
  • Use the simpler npm install-test command.
  • Don’t specify the CI environment variable as it’s set by default.
• Added a package sideEffects field.
• More specific package main path.
• Removed npm-debug.log from the .gitignore file as npm v4.2.0+ doesn’t create it in the current working directory.
• Improved the package test:prettier script.
• Configured Prettier option semi to the default, true.
• The exported fake tag function now has the name fakeTag instead of being anonymous.
• Updated the EditorConfig.
• Readme tweaks.
• The file changelog.md is no longer published.