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.

Unable to use after ejecting with create-react-app

See original GitHub issue

I hope I have followed everything correctly. I ejected from create-react-app and tried to configure css-blocks and I am struggling to get it working.

Here’s the repo to reproduce the problem:

Using node v8.10.0 and yarn 1.6.0.

The errors in console / on the page are:

ReferenceError: styles is not defined
> 1 | import React from 'react'
  2 | import styles from './Footer.block.css'
  3 | import objstr from "obj-str"
  4 | 
View compiled
/css-blocks-and-create-react-app/webpack/bootstrap 1e2d177e1b3a970db6c8:19
(anonymous function)
> 1 | import React, { Component } from 'react';
  2 | 
  3 | import Footer from './components/Footer'
  4 | 
View compiled
/css-blocks-and-create-react-app/webpack/bootstrap 1e2d177e1b3a970db6c8:19
(anonymous function)
> 1 | import React from 'react';
  2 | import ReactDOM from 'react-dom';
  3 | import App from './App';
  4 | import registerServiceWorker from './registerServiceWorker';
View compiled
▶ 5 stack frames were collapsed.
This screen is visible only in development. It will not appear if the app crashes in production.
Open your browser’s developer console to further inspect this error.

Many thanks!

I have it working with other examples using Typescript, and I am loving what you guys are doing. I am really keen to start working with it without TS.

Issue Analytics

  • State:open
  • Created 5 years ago
  • Comments:6 (5 by maintainers)

github_iconTop GitHub Comments

bittttttencommented, May 18, 2018

@JiiB my repo is a css-blocks skeleton app after ejecting from create-react-app. I couldn’t get the website version working last week so I just dug around and asked questions and came up with that. It should work as it is.

If you are having problems with that repo of mine, make an issue there and we can go into more detail then.

chriseppsteincommented, May 17, 2018

Presently, the React files need to have the extension “jsx” or “tsx”. The next release will have a better error message about this.

Read more comments on GitHub >

github_iconTop Results From Across the Web

Unable to use the spread operator after ejecting create-react ...
I used create-react-app to create a react application. After I run eject, I am unable to use the spread operator as follows:
Read more >
Keeping up with Create React App (after ejecting) - Medium
When I first started, I was hoping we wouldn't need to eject. I had heard of modules such as react-app-rewired, which allow you...
Read more >
Available Scripts | Create React App
npm run eject ​ ... Once you eject , you can't go back! ... All of the commands except eject will still work,...
Read more >
Everything you need to know about react-scripts
First, create a new React app with the following command to find ... “one-way operation” and warns that “once you eject, you can't...
Read more >
Stop Ejecting Create React App - YouTube
Instead of ejecting CRA ( Create # React App ) you can get access to many option by using Craco. In this lesson...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Post

No results found

github_iconTop Related Hashnode Post

No results found