vue-composite-loader
A webpack loader for transforming .vue files into .js Vue composable components. Vue-composite-loader works in tandem with vue-loader to allow you to easily share your Vue components across services with the vue-composite plugin.
Installation
npm i --save-dev vue-composite-loader
Getting Started
Vue-composite-loader is intended to be used in tandem with vue-loader, generating self-executing JS modules from .vue files. The JS modules can be requested by other Vue applications using the vue-composite plugin.
- Once installed, add vue-composite-loader to your webpack.config.js file:
// Webpack > 2.0.xmodule.exports = { module: { rules: [ // ... { test: /\.vue$/, use: [ { loader: 'vue-loader', }, { loader: 'vue-composite-loader', options: { path: path.resolve(__dirname, 'path/to/output/'), }, }, ], } ] }},
- Run webpack.
- Compose your Vue applications by sharing links to the js modules with vue-composite.
Example
Input
{{msg}}
Output
{ return name: 'app' { return msg: 'Hello Vue!' ; } template: `<div class="app">{{msg}}</div>` _injectCss: `.app { background-color: #eee; }`;};
Limitations
Currently, vue-composite-loader does not support any template or style pre-processors such as Jade or Sass. These are planned enhancements.
Development Setup
npm installnpm lintnpm run test