0

Originally, I had an index.html page with a div containing a <div id="react-content"></div element. I have now included handlebars as a template language to serve react ui elements rendered to string.

The problem is, I am using a css-loader to import css into my node project and it's not importing anymore. When I used the index.html file it worked, but now its not, node is throwing an error (not webpack). I'd rather not include the style sheet in a public directory as a <link />. I can't think of a reason to why this is happening.

Error

SyntaxError: /Users/***/Documents/Isomorphic React-Node/
Restuarant /src/components/homePageStyle.css: Unexpected token (6:0)

    import React, {Component}  from 'react';
    import PropTypes from 'prop-types';
    import HeaderMenu from './HeaderMenu';
    import MainVisualDisplay from './MainVisualDisplay';
    import homePageStyle from './homePageStyle.css';

    //HomePage component
     const HomePage = () => 
    {  
    return (

    <div>
        <HeaderMenu item1="Menu" item2="Locations" item3="About Us"/>
    </div>
    )     
}
//
const forHeaderMenu = () => (
    HomePage.item1: PropTypes.string.isRequired,
    HomePage.item2: PropTypes.string.isRequired,
    HomePage.item3: PropTypes.string.isRequired
)

const forMainVisualDisplay = () =>
(
    HomePage.displayImages: PropTypes.array
)

HomePage.propTypes = {
        forHeaderMenu,
        forMainVisualDisplay
    };

export default HomePage;
wizeOnes
  • 119
  • 16

1 Answers1

0

Figured it out. Node was trying to compile the .css extension when it only know .js. I needed to an an extension.

require.extensions['.css'] = () => {
  return;
};
wizeOnes
  • 119
  • 16