CODEWITHSUNDEEP
reactjs
skyeNoLimit
skyeNoLimit

Reputation: 33

Field 'browser' doesn't contain a valid alias configuration /my-react-app/src/components/FirstExample/FirstExample doesn't exist

I'm trying to import my FirstExample component to app.js but I'm receiving an error message saying the module is not found.

my App.js

import FirstExample from "./components/FirstExample";

function App() {
  return (
    <div className="App">
      <FirstExample />
    </div>
  );
}

export default App;

the file I want to render is in the components folder:

import React from 'react'
import './FirstExample';

const FirstExample = () => {
  return (
    <div>FirstExample</div>
  )
}

export default FirstExample

File structure looks like:

src
  components (folder)
    FirstExample
      FirstExample.css
      index.js <-- this is the file I want to render
  App.js
  index.css
  index.js

I checked my import statement and it looks correct. Why is it saying the module is not found??

Upvotes: 1

Views: 1324

Answers (1)

Damian Busz
Damian Busz

Reputation: 1848

This is correct behaviour.

You are trying to import FirstExample inside FirstExample component. That makes absolutely no sense and I think is a typo from your side.

What you are propably wanting to do is to import FirstExample.scss

import './FirstExample.scss';

Upvotes: 1

Related Questions