docs: absolue imports

Summary

Currently the docs recommend to set absolute imports within webpack. While this does work it only applies to webpack. If you are trying to eject from gatsby’s eslint rules or use other tools they will not know how to resolve these and will complain. For those using yarn 1 or 2 there is a better way:

the best practice is to set them in your package.json:

{
  "dependencies": {
      "hooks": "link:./src/hooks",
  }
}

I read this some where more authoritative but can’t find where (yarn docs I believe), I’ll keep looking and update this if I find the link.

https://yarnpkg.com/features/protocols

Motivation

This allows all tools to resolve these paths and preps you for yarn pnp.

Steps to resolve this issue

Draft the doc

• Update the doc, following the format listed in these resources:
  • Overview on contributing to documentation
  • Docs Templates
  • Example of a similar article

Open a pull request

• Open a pull request with your work including the words “closes #[this issue’s number]” in the pull request description

[wardpeet]

Thanks @moonmeister, this shows how broken the ecosystem is, and Rome is being built.

I do feel your pain. I mostly use https://github.com/tleunen/eslint-import-resolver-babel-module which also tells me how to configure eslint, and because of babel, webpack has the right config as well. I haven’t thought of link: before so TIL 😃. The problem with link as stated above its yarn only and we still have to tell babel to transpile `node_modules/hooks, as stated in our docs https://github.com/gatsbyjs/gatsby/blob/master/docs/docs/add-custom-webpack-config.md#modifying-the-babel-loader

What if we keep things as is but add a section about “yarn” + “link” and using multiple tools like eslint/typescript/… We don’t want to advocate yarn too much but If it’s a small section, I think it’s okay.

[moonmeister]

Go for it! Thanks! Ping me when you open the PR and I’ll give it a look.