vue-automatic-import-loader
Using a match function to automatic import your own project's components
This repo copy from vuetify-loader and remove the vuetify part.
Introduction
vue-automatic-import-loader is a webpack plugin that automatically import SFC.
Here is the example:
This is a button component
will be automatically compiled to:
This is a button component
Run example project
$ git clone https://github.com/hunterliu1003/vue-automatic-import-loader.git$ cd vue-automatic-import-loader/dev$ yarn install$ yarn serve
Then you can see demo in http://localhost:8080/
Usage
Install package
$ npm install --save vue-automatic-import-loader# or $ yarn add vue-automatic-import-loader
Vue CLI 3
in vue.config.js:
const VueAutomaticImportPlugin = moduleexports = configureWebpack: plugins: { /** * This function will be called for every tag used in each vue component * It should return an array, the first element will be inserted into the * components array, the second should be a corresponding import * * originalTag - the tag as it was originally used in the template * kebabTag - the tag normalised to kebab-case * camelTag - the tag normalised to PascalCase * path - a relative path to the current .vue file * component - a parsed representation of the current component */ if kebabTag return camelTag `import from '@/components/base/.vue'` }
Nuxt.js
in nuxt.config.js:
build: plugins: { /** * This function will be called for every tag used in each vue component * It should return an array, the first element will be inserted into the * components array, the second should be a corresponding import * * originalTag - the tag as it was originally used in the template * kebabTag - the tag normalised to kebab-case * camelTag - the tag normalised to PascalCase * path - a relative path to the current .vue file * component - a parsed representation of the current component */ if kebabTag return camelTag `import from '@/components/base/.vue'` }