Folder aliases using webpack

In order to define a folder alias using webpack, all you have to do is write the following in `webpack.config.js`:

```js
const path = require('path');

module.exports = {
  ...
  resolve: {
    alias: {
      '@': path.resolve('src'),
      images: path.resolve('assets/images'),
    },
  },
};
```

Now , if you want to import something from `assets/images`, all you need do to is

```js
import image from 'images/[path]'
```
regardless of the current directory.

If the location of any of the folders defined with aliases ever changes, you no longer need to update all the imports - changing the path in `webpack.config.js` will take care of everything.

Denisa Halmaghi
17 Nov 2021
« Back to post