Skip to content

re:add src directory to webpack resolve.modules @next #4336

Closed
@transitive-bullshit

Description

@transitive-bullshit

This is meant as a follow-up to #3596, as I'm testing out the newest CRA alpha react-scripts 2.0.0-next.66cc7a90.

The new CRA has solved several of my common reasons for having to use react-app-rewired, but there are a few pain points that remain.

One of them is adding the top-level src to the webpack resolve path so all components can import paths relative to the src root as opposed to relative to the file itself. I find this to be cleaner and more descriptive. E.g., this:

import Foo from 'components/Foo'
import Bar from 'store/Bar'
import Util from 'lib/Util'

instead of

import Foo from '../Foo'
import Bar from '../../store/Bar'
import Util from '../../lib/Util'

I generally accomplish this via react-app-rewired:

module.exports = (config, env) => {
  config.resolve.modules = [
    path.join(__dirname, 'src')
  ].concat(config.resolve.modules)

  return config
}

But I figure this has to be a pretty common practice, and I don't really see any downsides to allowing this in the base CRA webpack config, so I thought I'd suggest it as a very minor change for CRA@next.

I know the current suggestion is to add NODE_PATH=src to .env (#3596) with #1333 tracking a more permanent solution, but as of the latest alpha, this functionality is still not working.

To be clear, I generally add this via react-app-rewired because relying on .env which I've relegated to containing secrets means that the project will no longer "just work" for other devs out of the box.

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions