Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/mys1024/vite-plugin-easy-resolve-alias
Make it easy to config Vite's resolve alias.
https://github.com/mys1024/vite-plugin-easy-resolve-alias
alias easy plugin resolve simplify vite vitejs
Last synced: 6 days ago
JSON representation
Make it easy to config Vite's resolve alias.
- Host: GitHub
- URL: https://github.com/mys1024/vite-plugin-easy-resolve-alias
- Owner: mys1024
- License: mit
- Created: 2022-10-01T11:08:43.000Z (over 2 years ago)
- Default Branch: main
- Last Pushed: 2022-10-21T18:45:43.000Z (about 2 years ago)
- Last Synced: 2025-01-09T07:00:26.266Z (9 days ago)
- Topics: alias, easy, plugin, resolve, simplify, vite, vitejs
- Language: TypeScript
- Homepage: https://www.npmjs.com/package/vite-plugin-easy-resolve-alias
- Size: 63.5 KB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# vite-plugin-easy-resolve-alias
Make it easy to config [Vite](https://vitejs.dev/)'s [resolve alias](https://vitejs.dev/config/shared-options.html#resolve-alias).
## Install
```shell
npm install -D vite-plugin-easy-resolve-alias
```## Usage
### Basic
Add this plugin in your `vite.config.js`:
```javascript
import { defineConfig } from 'vite'
import ResolveAlias from 'vite-plugin-easy-resolve-alias'export default defineConfig({
plugins: [
ResolveAlias({ '~/': 'src/' })
]
})
```then you can use the alias you configured:
```javascript
import foo from '~/foo'
const bar = foo()
```### Use RegExp
Regular expression is allowed while passing in an array like this:
```javascript
import { defineConfig } from 'vite'
import ResolveAlias from 'vite-plugin-easy-resolve-alias'export default defineConfig({
plugins: [
ResolveAlias([{ find: /^~\//, replacement: 'src/' }])
]
})
```## TypeScript Support
If you are using **TypeScript**, don't forget to configure your `tsconfig.json` like this:
```json
{
"compilerOptions": {
"paths": {
"~/*": ["./src/*"]
}
}
}
```## Comparison
Before:
```javascript
import { defineConfig } from 'vite'
import path from 'path'
import Vue from '@vitejs/plugin-vue'export default defineConfig({
plugins: [
Vue()
],
resolve: {
alias: {
'~/': `${path.resolve(__dirname, 'src')}/`
}
}
})
```After:
```javascript
import { defineConfig } from 'vite'
import ResolveAlias from 'vite-plugin-easy-resolve-alias'
import Vue from '@vitejs/plugin-vue'export default defineConfig({
plugins: [
ResolveAlias({ '~/': 'src/' }),
Vue()
]
})
```## License
MIT