[ci] yarn format
This commit is contained in:
parent
2da7078eff
commit
dfafbe54d7
1 changed files with 7 additions and 10 deletions
|
@ -3,15 +3,15 @@ layout: ~/layouts/MainLayout.astro
|
||||||
title: Aliases
|
title: Aliases
|
||||||
---
|
---
|
||||||
|
|
||||||
An **alias** is a handy shortcut for your JavaScript import paths. This can be a great option if you dislike long relative import paths with many repeating `../` segments. Define an **alias** in your project to import directly from some directory no matter how deeply nested a file is located.
|
An **alias** is a handy shortcut for your JavaScript import paths. This can be a great option if you dislike long relative import paths with many repeating `../` segments. Define an **alias** in your project to import directly from some directory no matter how deeply nested a file is located.
|
||||||
|
|
||||||
With aliases, you can import from `"components/SomeComponent.astro"` instead of `"../../../../../components/SomeComponent.astro"`.
|
With aliases, you can import from `"components/SomeComponent.astro"` instead of `"../../../../../components/SomeComponent.astro"`.
|
||||||
|
|
||||||
## Adding a custom alias
|
## Adding a custom alias
|
||||||
|
|
||||||
To add custom aliases to your project, located in the root of your project is the `snowpack.config.mjs` file. This configuration file contains the instructions for Astro's build tool [Snowpack](https://www.snowpack.dev/reference/configuration), on how to build out your Astro project.
|
To add custom aliases to your project, located in the root of your project is the `snowpack.config.mjs` file. This configuration file contains the instructions for Astro's build tool [Snowpack](https://www.snowpack.dev/reference/configuration), on how to build out your Astro project.
|
||||||
|
|
||||||
> **Note:** some projects don't come with this file out of the box, feel free to create it yourself. [More on snowpack.config.mjs.](https://www.snowpack.dev/reference/configuration)
|
> **Note:** some projects don't come with this file out of the box, feel free to create it yourself. [More on snowpack.config.mjs.](https://www.snowpack.dev/reference/configuration)
|
||||||
|
|
||||||
Inside the file you will notice that there are already some predefined aliases.
|
Inside the file you will notice that there are already some predefined aliases.
|
||||||
|
|
||||||
|
@ -26,7 +26,6 @@ export default {
|
||||||
plugins: ['@snowpack/plugin-dotenv'],
|
plugins: ['@snowpack/plugin-dotenv'],
|
||||||
workspaceRoot: '../',
|
workspaceRoot: '../',
|
||||||
};
|
};
|
||||||
|
|
||||||
```
|
```
|
||||||
|
|
||||||
To **add your own** alias just define it on a new line, like so:
|
To **add your own** alias just define it on a new line, like so:
|
||||||
|
@ -38,24 +37,22 @@ export default {
|
||||||
alias: {
|
alias: {
|
||||||
components: './src/components',
|
components: './src/components',
|
||||||
'~': './src',
|
'~': './src',
|
||||||
'@public': './public' // This can be virtually anything
|
'@public': './public', // This can be virtually anything
|
||||||
},
|
},
|
||||||
plugins: ['@snowpack/plugin-dotenv'],
|
plugins: ['@snowpack/plugin-dotenv'],
|
||||||
workspaceRoot: '../',
|
workspaceRoot: '../',
|
||||||
};
|
};
|
||||||
|
|
||||||
```
|
```
|
||||||
|
|
||||||
| Key | Value |
|
| Key | Value |
|
||||||
| ----- | ----- |
|
| --------------------------- | ---------------------------------- |
|
||||||
| The keyword you'll be using | The path it will get replaced with |
|
| The keyword you'll be using | The path it will get replaced with |
|
||||||
|
|
||||||
## Usage
|
## Usage
|
||||||
|
|
||||||
|
|
||||||
Now just use the **defined** aliases in a file of your choice:
|
Now just use the **defined** aliases in a file of your choice:
|
||||||
|
|
||||||
```js
|
```js
|
||||||
import '@public/assets/logo.svg';
|
import '@public/assets/logo.svg';
|
||||||
import MyComponent from 'components/MyComponent/MyComponent.tsx'
|
import MyComponent from 'components/MyComponent/MyComponent.tsx';
|
||||||
```
|
```
|
||||||
|
|
Loading…
Add table
Reference in a new issue