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.

Allow html conditional comments and doctype

See original GitHub issue

I’m hacking on an fully server and client compatible app using React. One obstactle I’m running into is it seems react doesn’t like exclamation marks in your jsx-style code.

Here’s an example of a pretty standard boilerplate for HTML:

<!doctype html>
  <!--[if IE 7]>    <html class="no-js ie ie7 ltie8 ltie9"><![endif]-->
  <!--[if IE 8]>    <html class="no-js ie ie8 ltie9"><![endif]-->
  <!--[if gt IE 8]> <html class="no-js ie gtie8"><![endif]-->
  <!--[if !IE]><!--><html class="no-js" xmlns:og="http://opengraphprotocol.org/schema/" xmlns:fb="http://www.facebook.com/2008/fbml" ><!--<![endif]-->
    <head>
      <meta charset="utf-8">
      <meta http-equiv="X-UA-Compatible" content="IE=edge">
      <title></title>
      <meta name="description" content="">
      <meta name="viewport" content="width=device-width, initial-scale=1">

      <link rel="stylesheet" href="/css/app.css" type="text/css" media="all" />
    </head>
    <body>
      <!--[if lt IE 8]>
        <p class="browsehappy">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.</p>
      <![endif]-->

      {this.props.page}

      <!-- <script src="/js/vendor.js"></script> -->
      <script src="/js/app.js"></script>
    </body>
  </html>

I think it’s getting stuck on the conditional comments in this example.

I would prefer to keep this code in the HTML style, and to render it from the server without making major changes, it needs to be inside a react class. I’d be open to trying to hack this together, I may take a stab sometime this coming week.

Issue Analytics

State:
Created 10 years ago
Reactions:11
Comments:56 (19 by maintainers)

Top GitHub Comments

65reactions

petehuntcommented, Feb 6, 2014

While this is true it sucks for people who want to do full-page server rendering. I think if we claim to support full-page server rendering we should at least support doctype.

10reactions

optimalisatiecommented, Jul 8, 2016

Hi!

I have found a new method to include HTML comments (e.g. conditional IE comments) in JSX and React components using a Web Component.

https://github.com/optimalisatie/react-jsx-html-comments

<react-comment>[if lt IE 8]</react-comment>
<p class="browsehappy">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.</p>
<react-comment>[endif]</react-comment>