danielstern / isomorphic-react

A simple but powerful React application built on a standards-compliant back-end
https://isomorphic-react-x.herokuapp.com/
380 stars 259 forks source link

Resolve Alias Support Additions #44

Closed fantypants closed 3 years ago

fantypants commented 4 years ago

[Found the solution -- At end]

Hello, I've been adapting a current project to a isomorphic app (from CRA + Prerender).

I've heavily used aliases within the code base, I've been trying to get them to work with your setup, however it can never find the module:

import TagsList from 'components/TagsList' (not working) instead of import TagsList from './TagsList' (working)

Usually the resolves have been working fine with a webpack config such as the below:

resolve: { extensions: ['*', '.js', '.jsx'], alias: { components: path.resolve(__dirname, 'src/components') }

However, within the scope of express, babel-node & webpack: webpack --mode production correctly builds the project cross-env NODE_ENV=development babel-node server --useServerRender=true --useLiveData=false results in the aliased modules not found.

Could this be a bundle issue from webpack? --Babel needs the alias I believe I've missed something, or Am I doing the resolves wrong with babel? Babel needed the alias, hence why it worked with production. Is there any specific way to use resolves so aliasing works? -- Module Resolver

SOLUTION:

Use: https://www.npmjs.com/package/babel-plugin-module-resolver ["module-resolver", { "root": ["./src"],"alias": {"components": "./src/components"}}]

danielstern commented 4 years ago

What's the error output by the bundler?

danielstern commented 4 years ago

Happy to see a PR for this

fantypants commented 4 years ago

Apologies for the delay Daniel; I'll have a look into the configuration again to see for the PR, our App is well and truly beyond this context now, however, when I get a quiet moment I'll check & implement a correct PR for it.

danielstern commented 4 years ago

Hey Matthew! No problem. As always our professional commitments must be judiciously balanced with our open source interests!


From: Matthew notifications@github.com Sent: August 11, 2020 9:03 AM To: danielstern/isomorphic-react isomorphic-react@noreply.github.com Cc: Daniel Stern daniel@danielstern.ca; Comment comment@noreply.github.com Subject: Re: [danielstern/isomorphic-react] Resolve Alias Support Additions (#44)

Apologies for the delay Daniel; I'll have a look into the configuration again to see for the PR, our App is well and truly beyond this context now, however, when I get a quiet moment I'll check & implement a correct PR for it.

— You are receiving this because you commented. Reply to this email directly, view it on GitHubhttps://github.com/danielstern/isomorphic-react/issues/44#issuecomment-671933595, or unsubscribehttps://github.com/notifications/unsubscribe-auth/ABASA6H55BN5T35AKXS7WN3SAE6RLANCNFSM4NZ6SGSA.