https://github.com/unix/vue-auto
Use Vue in a simpler way.
https://github.com/unix/vue-auto
Last synced: 3 months ago
JSON representation
Use Vue in a simpler way.
- Host: GitHub
- URL: https://github.com/unix/vue-auto
- Owner: unix
- License: mit
- Created: 2019-04-01T05:25:12.000Z (about 6 years ago)
- Default Branch: master
- Last Pushed: 2020-02-16T08:04:18.000Z (over 5 years ago)
- Last Synced: 2025-03-10T18:11:23.039Z (4 months ago)
- Language: JavaScript
- Homepage:
- Size: 181 KB
- Stars: 14
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# vue-auto
> use Vue in a simpler way.
`vue-auto` can help you inject all components automatically, It makes your project simpler, cleaner.
### Features
- No Import.
- No `Vue.component`.
- No `component.name`.
- No `Router.component`.
### Automation
- Auto import `Component`:
You created a component file:
```
// hello.vue
hello
```
It can be used anywhere:
```
```
- Auto set `router`
File `pages/home.vue` == router `/home`:
```
// pages/home.vue
home
```
File `pages/posts/[id].vue` == router `/posts/20`:
```
// pages/posts/[id].vue
This is a dynamic route, {{ $route.params.id }}
```
It's easy.
### Usage
1. install: `npm i vue-auto`.
2. create `components/` and `pages/` folder.
3. import to your `main.js`:
```js
import Vue from 'vue'
import { install } from 'vue-auto'
const router = install(Vue, { prefix: 'my' })
new Vue({
router,
render: h => h(app),
}).$mount('#app')
```
**Any component will be automatically injected into the global, you can also customize component prefixe.**
### Guide
> Please complete the init in step [Usage](#Usage) first.
- Components:
- use `my-{filename}` in anywhere.
- prefixe can be modified in `options.prefix`, default is `auto`.
- any component can refer to each other.
- Routers:
- files under folder `pages` will automatically be routed.
- get router `/about` == create file `/pages/about.vue`.
- get router `/posts/:id` == create file `/posts/[id].vue`.
- get router `/pages/first` == create file `/posts/first.vue`. (static routes take precedence over dynamic routes)
### Options
Here are the `options` of `install(vue, options)`
| name | type | description | default | example |
|---|---|---|---|---|
| prefix | `string` | custom component prefix | `auto` | `my` |
| autoRouter | `boolean` | auto inject router | `true` | - |
| mode | `string` | h5 router mode | `history` | - |
| base | `string` | router base | `process.env.BASE_URL` | - |
| routes | `array` | extra routes: [RouteConfig](https://router.vuejs.org/zh/api/#routes) | `[]` | - |
### Examples
- [micro project](https://github.com/unix/vue-auto/tree/master/examples/micro)
- [with-router-project](https://github.com/unix/vue-auto/tree/master/examples/with-routers)
### LICENSE
[MIT](LICENSE)