Nagy Hunor
Nagy Hunor

Reputation: 53

How to set 'src' to resource root in webpack?

I have a react application, with custom webpack config (webpack-encore).

How can I set 'src' folder as resource root.
Ex:

I want to use

import 'components/someComponent.jsx' 

instead of

import '../../components/someComponent.jsx' 

Folder structure:

  1. -app
  2. --src
  3. ---components

Upvotes: 5

Views: 3767

Answers (2)

Hein Htet Zaw
Hein Htet Zaw

Reputation: 68

All you have to do is adding like this in webpack config.

module.exports = {
 // ...
 resolve: {
  modules: [path.resolve(__dirname, 'app/src')]
 }
}

Upvotes: 4

Zohaib Ijaz
Zohaib Ijaz

Reputation: 22875

You can create some alias and then use a shorter path

let config = Encore.getWebpackConfig();
config.resolve.alias["~"] = path.resolve(__dirname, 'app/src');
module.exports = config;

Now your import will look like

import SomeComponent from '~/components/someComponent.jsx'

Upvotes: 1

Related Questions