CODEWITHSUNDEEP
javascript
rinrin0000
rinrin0000

Reputation: 83

Can't I write relative path in React.js？

I am making an application transite several pages by seeing the pages.

The error happens

Failed to compile

./src/Router.js
Module not found: Can't resolve './pages/pageA' in '/Users/xxx/app/frontend/src'

I wrote in src/Router.js

import React, { Scene, Router, Actions  } from 'react';
import pageA from './pages/pageA';
import pageB from './pages/pageB';
import pageC from './pages/pageC';

const RouterComponent = () => {
  return (
    <Router>
      <Scene>
        <Scene
          key="pageA"
          component={pageA}
          title="Page A"
          rightTitle="toB"
          onRight={() => { Actions.pageB(); }}
        />
        <Scene
          key="pageB"
          component={pageB}
          title="Page B"
          rightTitle="toC"
          onRight={() => { Actions.pageC(); }}
        />
        <Scene key="pageC" component={pageC} title="Page C" />
      </Scene>
    </Router>
  )
}

export default RouterComponent;

Directory structure is enter image description here

Can't I write relative path in React.js？How should I fix this?

Upvotes: 1

Views: 222

Answers (1)

Praveen Kumar Purushothaman
Praveen Kumar Purushothaman

Reputation: 167182

This is because the pages directory is not inside src directory or sibling of Router.js. Move the pages directory inside src directory. That should work.

Now read on...

You can have write relative URLs and you have to write that way, but unfortunately, your directory structure says, you have the crucial JavaScript files out of the src folder. Please put the pages folder into the src folder and this should work.

Always have all the necessary JavaScript files inside the src folder for React to compile and work. None of the files should be out of it.

Upvotes: 1

Related Questions