Gigi
Gigi

Reputation: 157

What the "@" stands for in paths like "@/assets/xyz"?

Sometimes I see paths written like "@/assets/XXX", and I reckon it refers to the root maybe (in Nodejs)? But i guess it's a syntax that doesn't apply everywhere because when I want to refer to the root folder and try to use it, it sometimes break. I am not sure the implications of it.

Upvotes: 0

Views: 174

Answers (1)

Patrick
Patrick

Reputation: 66

The "@" is often used as an alias for a frequently used path (like src/) in webpack environments. You have to define it in your configuration file so the "@" can be resolved in the build-process.

If you work in an ES6 environment and import a component several times, it can be handy to create an alias for the component path.


Example (source: webpack documentation):

resolve.alias
object

Create aliases to import or require certain modules more easily. For example, to alias a bunch of commonly used src/ folders:

webpack.config.js

module.exports = {
  //...
  resolve: {
    alias: {
      Utilities: path.resolve(__dirname, 'src/utilities/'),
      Templates: path.resolve(__dirname, 'src/templates/')
    }
  }
};

Now, instead of using relative paths when importing like so:

import Utility from '../../utilities/utility';

you can use the alias:

import Utility from 'Utilities/utility';

You can find a similar answer here: https://stackoverflow.com/a/42753045/10764912

Upvotes: 1

Related Questions