0.7.0 • Published 6 years ago
vue-auto v0.7.0
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 <template> <p>hello</p> <template>It can be used anywhere:
<auto-hello>
Auto set
routerFile
pages/home.vue== router/home:// pages/home.vue <template> <p>home</p> <template>File
pages/posts/[id].vue== router/posts/20:// pages/posts/[id].vue <template> <p>This is a dynamic route, {{ $route.params.id }}</p> <template>It's easy.
Usage
install:
npm i vue-auto.create
components/andpages/folder.import to your
main.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 first.
Components:
- use
my-{filename}in anywhere. - prefixe can be modified in
options.prefix, default isauto. - any component can refer to each other.
- use
Routers:
- files under folder
pageswill 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)
- files under folder
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 | [] | - |