vue2-foundation

    1.3.1 • Public • Published

    vue2-foundation

    Vue 2.x component wrappers for Foundation 6 widgets

    Usage

    Install the package.

    npm i vue2-foundation --save npm i node-sass --save-dev

    Add an alias in your webpack configuration for the components:

    module.exports = {
      resolve: {
        alias: {
          'vf': 'vue2-foundation/components'
        }
      }
    }

    Load the Foundation Javascript and SCSS code:

    loadFoundation.scss:

    @import '../node_modules/foundation-sites/scss/foundation';
    @include foundation-everything()

    main.js:

    require('script!jquery')
    require('script!foundation-sites/dist/js/foundation.js')
    require('./loadFoundation.scss');

    Import and use the components in a .vue file:

    <template>
        <fo-button :to="{ name: 'settings' }">Settings</fo-button>
    </template>
     
    <script>
    import FoButton from 'vf/FoButton';
     
    export default {
        name: 'foo',
     
        components: {
            FoButton
        }
    }
    </script> 

    Building the documentation website

    # install dependencies
    npm install
     
    # serve with hot reload at localhost:8080
    npm run dev
     
    # build for production with minification
    npm run build

    LICENSE

    Copyright (c) 2016-2017 PointSource, LLC. MIT Licensed

    Install

    npm i vue2-foundation

    DownloadsWeekly Downloads

    2

    Version

    1.3.1

    License

    MIT

    Last publish

    Collaborators

    • asselin