❤
npm
Sign UpSign In

vue-slot-loader

0.0.3 • Public • Published

Vue Slot Loader

Use this loader to override parent component slot.

Example

<!-- Base component -->
<template>
  <div>
    <h1>Base Component</h2>
    <div>
      <slot></slot>
    </div>
  </div>
</template>

Now in the child component you can:

<!-- Base component -->
<!-- Pass 'name' attribute to slot tag override named slots -->
<slot>
  <span>Overrided content</span>
</slot>
 
<script>
export default {
    extends: Base
}
</script> 

Installation

Vue CLI Project (Webpack chain)

// vue.config.js
module.exports = {
  chainWebpack: config => {
    config.module
      .rule('vue-slot')
      .resourceQuery(/blockType=slot/)
      .use('vue-slot-loader')
      .loader('vue-slot-loader');
  }
};

Webpack config

// webpack.config.js
module.exports = {
  module: {
    rules: [
      {
        resourceQuery: /blockType=slot/,
        loader: 'vue-slot-loader'
      }
    ]
  }
};

Readme

Keywords

none

Package Sidebar

Install

npm i vue-slot-loader

Weekly Downloads

5

Version

0.0.3

License

MIT

Unpacked Size

7.29 kB

Total Files

13

Last publish

Collaborators

  • sasanfarrokh
Try on RunKit
Report malware