Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

[Typescript] Usage of Tagged Template Literal breaks Page

See original GitHub issue

Bug Report

We are using styled-components for styling our components and since version 3.3.3 the way you declare prop types is improved/properly implemented. It works perfectly fine in our normal app. In docz the page using such a component is blank and there is no error message neither in the browser nor on the command line.

To Reproduce

Create a styled-component with type declaration

const Flex = styled.div<{}>`
  display: flex;
`;

Import it in a .mdx file
See a blank page for that route

Expected behavior

Some error message that helps with debugging the issue further

Enviroment

OS: OSX 10.13.5
Node/npm version: Node 10.4/npm 6

Issue Analytics

State:
Created 5 years ago
Comments:10 (4 by maintainers)

Top GitHub Comments

4reactions

strothjcommented, Jul 24, 2018

Seems that this pull request to Babel is starting to progress: https://github.com/babel/babel/pull/7754

This pull request covers the tagged templates

3reactions

strothjcommented, Jul 29, 2018

This should be fixed now with the latest Babel release 7.0.0-beta.55

Top Results From Across the Web

Template literals (Template strings) - JavaScript | MDN

The string text that will become part of the template literal. Almost all characters are allowed literally, including line breaks and other ...

21 Using template literals and tagged templates - Exploring JS

Before we dig into the two features template literal and tagged template, let's first examine the multiple meanings of the term template.

Tagged template literals compiled incorrectly ... - GitHub

This is breaking lit-html when used in TypeScript: lit/lit#58 ... Use workaround for TypeScript template literals bug lit/lit#75.

Understanding Template Literals in JavaScript - DigitalOcean

A tagged template starts with a tag function that parses a template literal, allowing you more control over manipulating and returning a dynamic ......

TypeScript Template Literals break generic constraints

To do this, I am using TypeScript template literals. The issue is that while it broadly works, it seems to break generic constraints....