Home > Software design >  Diference between ./ and $ when importing modules into React project
Diference between ./ and $ when importing modules into React project

Time:04-20

The author of this project has imported a component using the following path:

import { client } from '$lib/graphql-client'

My question is: What's the $ symbol do? What's the difference between it and something like: import {client} from './lib/graphql-client' ?

CodePudding user response:

It's just an alias. In this particular example it resolves to ./src/lib.

See https://github.com/GraphCMS/graphcms-sveltekit-portfolio-and-blog-starter/blob/ca2b4175c312def64fb7965db860acd21f2ec707/svelte.config.js#L13

CodePudding user response:

That is a Path alias.

Path aliases: with path aliases, you can declare aliases for certain paths.

As you see in jsconfig inside compilerOptions you have:

1- baseUrl: telling compiler where to start resolving relative imports.

2- paths: defining your aliases for certain paths.

This is good for writing long and repeated paths.

  • Related