Absolute imports with Create React App

Plus ESLint and WebStorm config

David Gilbertson
5 min readMay 19, 2019

With the release of Create React App 3, we now have the ability to use absolute import paths, without ejecting.

Hallelujah.

If you’re reading this you probably don’t need me to tell you why this is a good thing. I’m going to anyway, though.

  • It’s easier to type out the paths, no more ../../../hell.
  • You can copy/paste code including imports into other files and not have to fiddle with the import paths.
  • You can move a file without having to update its input paths (if you IDE doesn’t do that for you anyway).
  • It’s neat.
That’s an absolute path

As explained in the docs, you start by creating a jsconfig.json file in your root with these characters and symbols in it:

That’s great, now you can take something like this:

--

--