Vue 2.x component wrappers for Foundation 6 widgets
npm i vue2-foundation jquery --save
npm i node-sass sass-loader --save-dev
module.exports = { resolve: { alias: { 'vf': 'vue2-foundation/components' } } }
loadFoundation.scss:
@import '../node_modules/foundation-sites/scss/foundation'; @include foundation-everything()
main.js:
require('script-loader!jquery') require('script-loader!foundation-sites/dist/js/foundation.js') require('./loadFoundation.scss');
<template> <fo-button :to="{ name: 'settings' }">Settings</fo-button> </template> <script> import FoButton from 'vf/FoButton'; export default { name: 'foo', components: { FoButton } } </script>
# install dependencies npm install # serve with hot reload at localhost:8080 npm run dev # build for production with minification npm run build
Copyright (c) 2016-2017 PointSource, LLC. MIT Licensed