{"_id":"vue-fela","_rev":"27-802e55728269f14881f11d569ea6cced","name":"vue-fela","description":"Vue Fela Plugin","dist-tags":{"latest":"3.4.0","beta":"3.0.0"},"versions":{"0.0.1":{"name":"vue-fela","version":"0.0.1","description":"Fela bindings for vue","author":{"name":"Dustin Hoffner"},"main":"dist/vue-fela.common.js","module":"dist/vue-fela.esm.js","browser":"dist/vue-fela.js","unpkg":"dist/vue-fela.js","style":"dist/vue-fela.css","files":["dist","src"],"scripts":{"clean":"rimraf dist","build":"node build/build.js","build:dll":"webpack --progress --config build/webpack.config.dll.js","lint":"yon run lint:js && yon run lint:css","lint:js":"eslint --ext js --ext jsx --ext vue src test/**/*.spec.js test/*.js build","lint:js:fix":"yon run lint:js -- --fix","lint:css":"stylelint src/**/*.{vue,css}","lint:staged":"lint-staged","pretest":"yon run lint","test":"cross-env BABEL_ENV=test karma start test/karma.conf.js --single-run","dev":"webpack-dashboard -- webpack-dev-server --config build/webpack.config.dev.js --open","dev:coverage":"cross-env BABEL_ENV=test karma start test/karma.conf.js","prepublish":"yon run build"},"lint-staged":{"*.{vue,jsx,js}":["eslint --fix"],"*.{vue,css}":["stylefmt","stylelint"]},"pre-commit":"lint:staged","devDependencies":{"add-asset-html-webpack-plugin":"^2.0.0","babel-core":"^6.24.0","babel-eslint":"^7.2.0","babel-helper-vue-jsx-merge-props":"^2.0.0","babel-loader":"^7.0.0","babel-plugin-istanbul":"^4.1.0","babel-plugin-syntax-jsx":"^6.18.0","babel-plugin-transform-object-rest-spread":"^6.23.0","babel-plugin-transform-runtime":"^6.23.0","babel-plugin-transform-vue-jsx":"^3.4.0","babel-preset-env":"^1.4.0","buble":"^0.15.2","chai":"^3.5.0","chai-dom":"^1.4.0","clean-css":"^4.0.0","cross-env":"^4.0.0","css-loader":"^0.28.0","eslint":"^3.19.0","eslint-config-vue":"^2.0.0","eslint-plugin-vue":"^2.0.0","extract-text-webpack-plugin":"^2.1.0","html-webpack-plugin":"^2.28.0","karma":"^1.7.0","karma-chai-dom":"^1.1.0","karma-chrome-launcher":"^2.1.0","karma-coverage":"^1.1.0","karma-mocha":"^1.3.0","karma-sinon-chai":"^1.3.0","karma-sourcemap-loader":"^0.3.7","karma-spec-reporter":"^0.0.31","karma-webpack":"^2.0.0","lint-staged":"^3.4.0","mkdirp":"^0.5.1","mocha":"^3.3.0","mocha-css":"^1.0.1","postcss":"^6.0.0","postcss-cssnext":"^2.10.0","pre-commit":"^1.2.0","rimraf":"^2.6.0","rollup":"^0.41.6","rollup-plugin-buble":"^0.15.0","rollup-plugin-commonjs":"^8.0.0","rollup-plugin-jsx":"^1.0.0","rollup-plugin-node-resolve":"^3.0.0","rollup-plugin-postcss":"^0.4.1","rollup-plugin-replace":"^1.1.0","rollup-plugin-vue":"^2.3.0","sinon":"2.2.0","sinon-chai":"^2.10.0","style-loader":"^0.17.0","stylefmt":"^5.3.0","stylelint":"^7.10.0","stylelint-config-standard":"^16.0.0","stylelint-processor-html":"^1.0.0","uglify-js":"^3.0.0","uppercamelcase":"^3.0.0","vue":"^2.3.0","vue-loader":"^12.0.0","vue-template-compiler":"^2.3.0","webpack":"^2.5.0","webpack-bundle-analyzer":"^2.4.0","webpack-dashboard":"^0.4.0","webpack-dev-server":"^2.4.0","webpack-merge":"^4.0.0","yarn-or-npm":"^2.0.0"},"peerDependencies":{"vue":"^2.3.0"},"dllPlugin":{"name":"vuePluginTemplateDeps","include":["mocha/mocha.js","style-loader!css-loader!mocha-css","html-entities","vue/dist/vue.js","chai","core-js/library","url","sockjs-client","vue-style-loader/lib/addStylesClient.js","events","ansi-html","style-loader/addStyles.js"]},"repository":{"type":"git","url":"git+https://github.com/dustin-h/vue-fela.git"},"bugs":{"url":"https://github.com/dustin-h/vue-fela/issues"},"homepage":"https://github.com/dustin-h/vue-fela#readme","license":{"type":"MIT","url":"http://www.opensource.org/licenses/mit-license.php"},"gitHead":"1b6234f548f63753f0a046b5190f6ca14d16df28","_id":"vue-fela@0.0.1","_shasum":"dc81137a6223f6d1ec86328f519ec786dd3d58e8","_from":".","_npmVersion":"3.10.10","_nodeVersion":"6.11.1","_npmUser":{"name":"dustin-h","email":"dustin.hoffner@mail.com"},"dist":{"shasum":"dc81137a6223f6d1ec86328f519ec786dd3d58e8","tarball":"https://registry.npmjs.org/vue-fela/-/vue-fela-0.0.1.tgz","integrity":"sha512-5YIcR2bR8OsprwHXY3zVPMiyvVZmUU2u7XjXWrNyP09/PAfTXyPL7Gh8faS1Q1W/6V1Tibur1a2+wv4IgNr1lA==","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCn3/a9THSRAxgduZ0wbmFLAKXB20yKtMReJzPolc5kPgIgM4ArhUpoO5WyXYXxE29+bQ/uc+FG6lvBk4vzkhDiDg4="}]},"maintainers":[{"name":"dustin-h","email":"dustin.hoffner@mail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/vue-fela-0.0.1.tgz_1502573808928_0.711057641543448"},"directories":{}},"0.0.2":{"name":"vue-fela","version":"0.0.2","description":"Fela bindings for vue","author":{"name":"Dustin Hoffner"},"main":"dist/vue-fela.common.js","module":"dist/vue-fela.esm.js","browser":"dist/vue-fela.js","unpkg":"dist/vue-fela.js","style":"dist/vue-fela.css","files":["dist","src"],"scripts":{"clean":"rimraf dist","build":"node build/build.js","build:dll":"webpack --progress --config build/webpack.config.dll.js","lint":"yon run lint:js && yon run lint:css","lint:js":"eslint --ext js --ext jsx --ext vue src test/**/*.spec.js test/*.js build","lint:js:fix":"yon run lint:js -- --fix","lint:css":"stylelint src/**/*.{vue,css}","lint:staged":"lint-staged","pretest":"yon run lint","test":"cross-env BABEL_ENV=test karma start test/karma.conf.js --single-run","dev":"webpack-dashboard -- webpack-dev-server --config build/webpack.config.dev.js --open","dev:coverage":"cross-env BABEL_ENV=test karma start test/karma.conf.js","prepublish":"yon run build"},"lint-staged":{"*.{vue,jsx,js}":["eslint --fix"],"*.{vue,css}":["stylefmt","stylelint"]},"pre-commit":"lint:staged","devDependencies":{"add-asset-html-webpack-plugin":"^2.0.0","babel-core":"^6.24.0","babel-eslint":"^7.2.0","babel-helper-vue-jsx-merge-props":"^2.0.0","babel-loader":"^7.0.0","babel-plugin-istanbul":"^4.1.0","babel-plugin-syntax-jsx":"^6.18.0","babel-plugin-transform-object-rest-spread":"^6.23.0","babel-plugin-transform-runtime":"^6.23.0","babel-plugin-transform-vue-jsx":"^3.4.0","babel-preset-env":"^1.4.0","buble":"^0.15.2","chai":"^3.5.0","chai-dom":"^1.4.0","clean-css":"^4.0.0","cross-env":"^4.0.0","css-loader":"^0.28.0","eslint":"^3.19.0","eslint-config-vue":"^2.0.0","eslint-plugin-vue":"^2.0.0","extract-text-webpack-plugin":"^2.1.0","html-webpack-plugin":"^2.28.0","karma":"^1.7.0","karma-chai-dom":"^1.1.0","karma-chrome-launcher":"^2.1.0","karma-coverage":"^1.1.0","karma-mocha":"^1.3.0","karma-sinon-chai":"^1.3.0","karma-sourcemap-loader":"^0.3.7","karma-spec-reporter":"^0.0.31","karma-webpack":"^2.0.0","lint-staged":"^3.4.0","mkdirp":"^0.5.1","mocha":"^3.3.0","mocha-css":"^1.0.1","postcss":"^6.0.0","postcss-cssnext":"^2.10.0","pre-commit":"^1.2.0","rimraf":"^2.6.0","rollup":"^0.41.6","rollup-plugin-buble":"^0.15.0","rollup-plugin-commonjs":"^8.0.0","rollup-plugin-jsx":"^1.0.0","rollup-plugin-node-resolve":"^3.0.0","rollup-plugin-postcss":"^0.4.1","rollup-plugin-replace":"^1.1.0","rollup-plugin-vue":"^2.3.0","sinon":"2.2.0","sinon-chai":"^2.10.0","style-loader":"^0.17.0","stylefmt":"^5.3.0","stylelint":"^7.10.0","stylelint-config-standard":"^16.0.0","stylelint-processor-html":"^1.0.0","uglify-js":"^3.0.0","uppercamelcase":"^3.0.0","vue":"^2.3.0","vue-loader":"^12.0.0","vue-template-compiler":"^2.3.0","webpack":"^2.5.0","webpack-bundle-analyzer":"^2.4.0","webpack-dashboard":"^0.4.0","webpack-dev-server":"^2.4.0","webpack-merge":"^4.0.0","yarn-or-npm":"^2.0.0"},"peerDependencies":{"vue":"^2.3.0"},"dllPlugin":{"name":"vuePluginTemplateDeps","include":["mocha/mocha.js","style-loader!css-loader!mocha-css","html-entities","vue/dist/vue.js","chai","core-js/library","url","sockjs-client","vue-style-loader/lib/addStylesClient.js","events","ansi-html","style-loader/addStyles.js"]},"repository":{"type":"git","url":"git+https://github.com/dustin-h/vue-fela.git"},"bugs":{"url":"https://github.com/dustin-h/vue-fela/issues"},"homepage":"https://github.com/dustin-h/vue-fela#readme","license":{"type":"MIT","url":"http://www.opensource.org/licenses/mit-license.php"},"gitHead":"1b6234f548f63753f0a046b5190f6ca14d16df28","_id":"vue-fela@0.0.2","_shasum":"78804180fe8cfcde01065285cae23f4d396da494","_from":".","_npmVersion":"3.10.10","_nodeVersion":"6.11.1","_npmUser":{"name":"dustin-h","email":"dustin.hoffner@gmail.com"},"dist":{"shasum":"78804180fe8cfcde01065285cae23f4d396da494","tarball":"https://registry.npmjs.org/vue-fela/-/vue-fela-0.0.2.tgz","integrity":"sha512-n6Q0lFbR0wJAp6q+Uz9/UA6ctgyZcRrHOik1+FVeQ8HkqXIaZpATQWRdA0uTeWHy9okFyapEfYX6LZRLRH905A==","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDOoJA1Vf6wycJfUB4XIHhT3nTrPV7LzakL+xZodbu2JAIgEX0CFkbCkwBzdJ1w+6/q79gcHt5mqViKFfLAI03B+y8="}]},"maintainers":[{"name":"dustin-h","email":"dustin.hoffner@mail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/vue-fela-0.0.2.tgz_1502612620628_0.560718891210854"},"directories":{}},"0.0.3":{"name":"vue-fela","version":"0.0.3","description":"Fela bindings for vue","author":{"name":"Dustin Hoffner"},"main":"dist/vue-fela.common.js","module":"dist/vue-fela.esm.js","browser":"dist/vue-fela.js","unpkg":"dist/vue-fela.js","style":"dist/vue-fela.css","files":["dist","src"],"scripts":{"clean":"rimraf dist","build":"node build/build.js","build:dll":"webpack --progress --config build/webpack.config.dll.js","lint":"yon run lint:js && yon run lint:css","lint:js":"eslint --ext js --ext jsx --ext vue src test/**/*.spec.js test/*.js build","lint:js:fix":"yon run lint:js -- --fix","lint:css":"stylelint src/**/*.{vue,css}","lint:staged":"lint-staged","pretest":"yon run lint","test":"cross-env BABEL_ENV=test karma start test/karma.conf.js --single-run","dev":"webpack-dashboard -- webpack-dev-server --config build/webpack.config.dev.js --open","dev:coverage":"cross-env BABEL_ENV=test karma start test/karma.conf.js","prepublish":"yon run build"},"lint-staged":{"*.{vue,jsx,js}":["eslint --fix"],"*.{vue,css}":["stylefmt","stylelint"]},"pre-commit":"lint:staged","devDependencies":{"add-asset-html-webpack-plugin":"^2.0.0","babel-core":"^6.24.0","babel-eslint":"^7.2.0","babel-helper-vue-jsx-merge-props":"^2.0.0","babel-loader":"^7.0.0","babel-plugin-istanbul":"^4.1.0","babel-plugin-syntax-jsx":"^6.18.0","babel-plugin-transform-object-rest-spread":"^6.23.0","babel-plugin-transform-runtime":"^6.23.0","babel-plugin-transform-vue-jsx":"^3.4.0","babel-preset-env":"^1.4.0","buble":"^0.15.2","chai":"^3.5.0","chai-dom":"^1.4.0","clean-css":"^4.0.0","cross-env":"^4.0.0","css-loader":"^0.28.0","eslint":"^3.19.0","eslint-config-vue":"^2.0.0","eslint-plugin-vue":"^2.0.0","extract-text-webpack-plugin":"^2.1.0","html-webpack-plugin":"^2.28.0","karma":"^1.7.0","karma-chai-dom":"^1.1.0","karma-chrome-launcher":"^2.1.0","karma-coverage":"^1.1.0","karma-mocha":"^1.3.0","karma-sinon-chai":"^1.3.0","karma-sourcemap-loader":"^0.3.7","karma-spec-reporter":"^0.0.31","karma-webpack":"^2.0.0","lint-staged":"^3.4.0","mkdirp":"^0.5.1","mocha":"^3.3.0","mocha-css":"^1.0.1","postcss":"^6.0.0","postcss-cssnext":"^2.10.0","pre-commit":"^1.2.0","rimraf":"^2.6.0","rollup":"^0.41.6","rollup-plugin-buble":"^0.15.0","rollup-plugin-commonjs":"^8.0.0","rollup-plugin-jsx":"^1.0.0","rollup-plugin-node-resolve":"^3.0.0","rollup-plugin-postcss":"^0.4.1","rollup-plugin-replace":"^1.1.0","rollup-plugin-vue":"^2.3.0","sinon":"2.2.0","sinon-chai":"^2.10.0","style-loader":"^0.17.0","stylefmt":"^5.3.0","stylelint":"^7.10.0","stylelint-config-standard":"^16.0.0","stylelint-processor-html":"^1.0.0","uglify-js":"^3.0.0","uppercamelcase":"^3.0.0","vue":"^2.3.0","vue-loader":"^12.0.0","vue-template-compiler":"^2.3.0","webpack":"^2.5.0","webpack-bundle-analyzer":"^2.4.0","webpack-dashboard":"^0.4.0","webpack-dev-server":"^2.4.0","webpack-merge":"^4.0.0","yarn-or-npm":"^2.0.0"},"peerDependencies":{"vue":"^2.3.0"},"dllPlugin":{"name":"vuePluginTemplateDeps","include":["mocha/mocha.js","style-loader!css-loader!mocha-css","html-entities","vue/dist/vue.js","chai","core-js/library","url","sockjs-client","vue-style-loader/lib/addStylesClient.js","events","ansi-html","style-loader/addStyles.js"]},"repository":{"type":"git","url":"git+https://github.com/dustin-h/vue-fela.git"},"bugs":{"url":"https://github.com/dustin-h/vue-fela/issues"},"homepage":"https://github.com/dustin-h/vue-fela#readme","license":{"type":"MIT","url":"http://www.opensource.org/licenses/mit-license.php"},"gitHead":"b6020aad0ffb812675d4d950b216d9b6add375fc","_id":"vue-fela@0.0.3","_shasum":"dc25baf75a6eb4b4a075ce664829d2519f7fba82","_from":".","_npmVersion":"3.10.10","_nodeVersion":"6.11.1","_npmUser":{"name":"dustin-h","email":"dustin.hoffner@gmail.com"},"dist":{"shasum":"dc25baf75a6eb4b4a075ce664829d2519f7fba82","tarball":"https://registry.npmjs.org/vue-fela/-/vue-fela-0.0.3.tgz","integrity":"sha512-NMx+a2M0kuZ6dw5Y36HAxoxlKsOLETQ2JhUx6UPglrtJYqmlZr7XsJDEGkRjljNjlPJgy1Exg1MF5OwcT/Z3fA==","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCa0uLJUrkRbob1LwyWGnh3QF0XP1AoC4YlDmb+2K/0DwIhAIebkLWDojYJy9/tQbN7CFaEjKseg8vZqK4YkzC7MsER"}]},"maintainers":[{"name":"dustin-h","email":"dustin.hoffner@mail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/vue-fela-0.0.3.tgz_1502627593188_0.8707424097228795"},"directories":{}},"0.0.4":{"name":"vue-fela","version":"0.0.4","description":"Fela bindings for vue","author":{"name":"Dustin Hoffner"},"main":"dist/vue-fela.common.js","module":"dist/vue-fela.esm.js","browser":"dist/vue-fela.js","unpkg":"dist/vue-fela.js","style":"dist/vue-fela.css","files":["dist","src"],"scripts":{"clean":"rimraf dist","build":"node build/build.js","build:dll":"webpack --progress --config build/webpack.config.dll.js","lint":"yon run lint:js && yon run lint:css","lint:js":"eslint --ext js --ext jsx --ext vue src test/**/*.spec.js test/*.js build","lint:js:fix":"yon run lint:js -- --fix","lint:css":"stylelint src/**/*.{vue,css}","lint:staged":"lint-staged","pretest":"yon run lint","test":"cross-env BABEL_ENV=test karma start test/karma.conf.js --single-run","dev":"webpack-dashboard -- webpack-dev-server --config build/webpack.config.dev.js --open","dev:coverage":"cross-env BABEL_ENV=test karma start test/karma.conf.js","prepublish":"yon run build"},"lint-staged":{"*.{vue,jsx,js}":["eslint --fix"],"*.{vue,css}":["stylefmt","stylelint"]},"pre-commit":"lint:staged","devDependencies":{"add-asset-html-webpack-plugin":"^2.0.0","babel-core":"^6.24.0","babel-eslint":"^7.2.0","babel-helper-vue-jsx-merge-props":"^2.0.0","babel-loader":"^7.0.0","babel-plugin-istanbul":"^4.1.0","babel-plugin-syntax-jsx":"^6.18.0","babel-plugin-transform-object-rest-spread":"^6.23.0","babel-plugin-transform-runtime":"^6.23.0","babel-plugin-transform-vue-jsx":"^3.4.0","babel-preset-env":"^1.4.0","buble":"^0.15.2","chai":"^3.5.0","chai-dom":"^1.4.0","clean-css":"^4.0.0","cross-env":"^4.0.0","css-loader":"^0.28.0","eslint":"^3.19.0","eslint-config-vue":"^2.0.0","eslint-plugin-vue":"^2.0.0","extract-text-webpack-plugin":"^2.1.0","html-webpack-plugin":"^2.28.0","karma":"^1.7.0","karma-chai-dom":"^1.1.0","karma-chrome-launcher":"^2.1.0","karma-coverage":"^1.1.0","karma-mocha":"^1.3.0","karma-sinon-chai":"^1.3.0","karma-sourcemap-loader":"^0.3.7","karma-spec-reporter":"^0.0.31","karma-webpack":"^2.0.0","lint-staged":"^3.4.0","mkdirp":"^0.5.1","mocha":"^3.3.0","mocha-css":"^1.0.1","postcss":"^6.0.0","postcss-cssnext":"^2.10.0","pre-commit":"^1.2.0","rimraf":"^2.6.0","rollup":"^0.41.6","rollup-plugin-buble":"^0.15.0","rollup-plugin-commonjs":"^8.0.0","rollup-plugin-jsx":"^1.0.0","rollup-plugin-node-resolve":"^3.0.0","rollup-plugin-postcss":"^0.4.1","rollup-plugin-replace":"^1.1.0","rollup-plugin-vue":"^2.3.0","sinon":"2.2.0","sinon-chai":"^2.10.0","style-loader":"^0.17.0","stylefmt":"^5.3.0","stylelint":"^7.10.0","stylelint-config-standard":"^16.0.0","stylelint-processor-html":"^1.0.0","uglify-js":"^3.0.0","uppercamelcase":"^3.0.0","vue":"^2.3.0","vue-loader":"^12.0.0","vue-template-compiler":"^2.3.0","webpack":"^2.5.0","webpack-bundle-analyzer":"^2.4.0","webpack-dashboard":"^0.4.0","webpack-dev-server":"^2.4.0","webpack-merge":"^4.0.0","yarn-or-npm":"^2.0.0"},"peerDependencies":{"vue":"^2.3.0","fela":"^4.3.5","fela-dom":"^4.3.5"},"dllPlugin":{"name":"vuePluginTemplateDeps","include":["mocha/mocha.js","style-loader!css-loader!mocha-css","html-entities","vue/dist/vue.js","chai","core-js/library","url","sockjs-client","vue-style-loader/lib/addStylesClient.js","events","ansi-html","style-loader/addStyles.js"]},"repository":{"type":"git","url":"git+https://github.com/dustin-h/vue-fela.git"},"bugs":{"url":"https://github.com/dustin-h/vue-fela/issues"},"homepage":"https://github.com/dustin-h/vue-fela#readme","license":{"type":"MIT","url":"http://www.opensource.org/licenses/mit-license.php"},"gitHead":"83c52ac5cfbbed483704be3da9e5322a3826098b","_id":"vue-fela@0.0.4","_npmVersion":"5.4.2","_nodeVersion":"8.1.4","_npmUser":{"name":"dustin-h","email":"dustin.hoffner@gmail.com"},"dist":{"integrity":"sha512-LKSRa5LL1gTN3/qlO7fl/6Vs7t+SMYPoeEJusZS7ziOgEmqJKqjKpG27lsU5X1ytXoYs23OcXZO5spegHfdVIg==","shasum":"156b453964052686bbcc1e3b3036bc4c5fb9a195","tarball":"https://registry.npmjs.org/vue-fela/-/vue-fela-0.0.4.tgz","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIDnB2EW7JzFLs3OE5zq8VsOBswX8ENYN/yXMnyYs3imsAiByWj62yN1XuDWhnRidOWNhAuGYR+RmRYUJiLkACWhGmQ=="}]},"maintainers":[{"name":"dustin-h","email":"dustin.hoffner@mail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/vue-fela-0.0.4.tgz_1507049135561_0.11217354610562325"},"directories":{}},"1.0.0":{"name":"vue-fela","version":"1.0.0","description":"Fela bindings for vue","author":{"name":"Dustin Hoffner"},"main":"dist/vue-fela.common.js","module":"dist/vue-fela.esm.js","browser":"dist/vue-fela.js","unpkg":"dist/vue-fela.js","style":"dist/vue-fela.css","files":["dist","src"],"scripts":{"clean":"rimraf dist","build":"node build/build.js","build:dll":"webpack --progress --config build/webpack.config.dll.js","lint":"yon run lint:js && yon run lint:css","lint:js":"eslint --ext js --ext jsx --ext vue src test/**/*.spec.js test/*.js build","lint:js:fix":"yon run lint:js -- --fix","lint:css":"stylelint src/**/*.{vue,css}","lint:staged":"lint-staged","pretest":"yon run lint","test":"cross-env BABEL_ENV=test karma start test/karma.conf.js --single-run","dev":"webpack-dashboard -- webpack-dev-server --config build/webpack.config.dev.js --open","dev:coverage":"cross-env BABEL_ENV=test karma start test/karma.conf.js","prepublish":"yon run build"},"lint-staged":{"*.{vue,jsx,js}":["eslint --fix"],"*.{vue,css}":["stylefmt","stylelint"]},"pre-commit":"lint:staged","devDependencies":{"add-asset-html-webpack-plugin":"^2.0.0","babel-core":"^6.24.0","babel-eslint":"^7.2.0","babel-helper-vue-jsx-merge-props":"^2.0.0","babel-loader":"^7.0.0","babel-plugin-istanbul":"^4.1.0","babel-plugin-syntax-jsx":"^6.18.0","babel-plugin-transform-object-rest-spread":"^6.23.0","babel-plugin-transform-runtime":"^6.23.0","babel-plugin-transform-vue-jsx":"^3.4.0","babel-preset-env":"^1.4.0","buble":"^0.15.2","chai":"^3.5.0","chai-dom":"^1.4.0","clean-css":"^4.0.0","cross-env":"^4.0.0","css-loader":"^0.28.0","eslint":"^3.19.0","eslint-config-vue":"^2.0.0","eslint-plugin-vue":"^2.0.0","extract-text-webpack-plugin":"^2.1.0","html-webpack-plugin":"^2.28.0","karma":"^1.7.0","karma-chai-dom":"^1.1.0","karma-chrome-launcher":"^2.1.0","karma-coverage":"^1.1.0","karma-mocha":"^1.3.0","karma-sinon-chai":"^1.3.0","karma-sourcemap-loader":"^0.3.7","karma-spec-reporter":"^0.0.31","karma-webpack":"^2.0.0","lint-staged":"^3.4.0","mkdirp":"^0.5.1","mocha":"^3.3.0","mocha-css":"^1.0.1","postcss":"^6.0.0","postcss-cssnext":"^2.10.0","pre-commit":"^1.2.0","rimraf":"^2.6.0","rollup":"^0.41.6","rollup-plugin-buble":"^0.15.0","rollup-plugin-commonjs":"^8.0.0","rollup-plugin-jsx":"^1.0.0","rollup-plugin-node-resolve":"^3.0.0","rollup-plugin-postcss":"^0.4.1","rollup-plugin-replace":"^1.1.0","rollup-plugin-vue":"^2.3.0","sinon":"2.2.0","sinon-chai":"^2.10.0","style-loader":"^0.17.0","stylefmt":"^5.3.0","stylelint":"^7.10.0","stylelint-config-standard":"^16.0.0","stylelint-processor-html":"^1.0.0","uglify-js":"^3.0.0","uppercamelcase":"^3.0.0","vue":"^2.3.0","vue-loader":"^12.0.0","vue-template-compiler":"^2.3.0","webpack":"^2.5.0","webpack-bundle-analyzer":"^2.4.0","webpack-dashboard":"^0.4.0","webpack-dev-server":"^2.4.0","webpack-merge":"^4.0.0","yarn-or-npm":"^2.0.0"},"peerDependencies":{"vue":"^2.3.0","fela":"^4.3.5","fela-dom":"^4.3.5"},"dllPlugin":{"name":"vuePluginTemplateDeps","include":["mocha/mocha.js","style-loader!css-loader!mocha-css","html-entities","vue/dist/vue.js","chai","core-js/library","url","sockjs-client","vue-style-loader/lib/addStylesClient.js","events","ansi-html","style-loader/addStyles.js"]},"repository":{"type":"git","url":"git+https://github.com/dustin-h/vue-fela.git"},"bugs":{"url":"https://github.com/dustin-h/vue-fela/issues"},"homepage":"https://github.com/dustin-h/vue-fela#readme","license":{"type":"MIT","url":"http://www.opensource.org/licenses/mit-license.php"},"gitHead":"9990a5083f6c992c7d570cbdd0d197ff8d53aa75","_id":"vue-fela@1.0.0","_npmVersion":"5.4.2","_nodeVersion":"8.1.4","_npmUser":{"name":"dustin-h","email":"dustin.hoffner@gmail.com"},"dist":{"integrity":"sha512-o2eC001uyac8T/31btsIGkr9Uy8RyDDKfGA4MaPumcX2DV+QMHTE/qbDHvNJjYXv8HgAZkinS8sA9vcp/tzLsQ==","shasum":"5394386fcd6b66d5db78e1280fd9c7efc9ff9717","tarball":"https://registry.npmjs.org/vue-fela/-/vue-fela-1.0.0.tgz","fileCount":12,"unpackedSize":17171,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCqa2QH/rG5JNhnMSIo6OGvs78E5RC5aS2/21CRQXdxMwIgdd24QEj2jMHhbRaJp3aPGUb9Nyv3pygBWi3hXpL6aBQ="}]},"maintainers":[{"name":"dustin-h","email":"dustin.hoffner@gmail.com"},{"name":"wagerfield","email":"matthew@wagerfield.com"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/vue-fela_1.0.0_1518441132555_0.2844330589411941"},"_hasShrinkwrap":false},"2.0.0":{"name":"vue-fela","version":"2.0.0","description":"Vue Fela Plugin","homepage":"https://github.com/wagerfield/vue-fela#readme","author":{"name":"Matthew Wagerfield","email":"matthew@wagerfield.com"},"license":"MIT","keywords":["vue","fela","plugin"],"files":["index.js","lib"],"main":"index.js","jest":{"mapCoverage":true,"moduleFileExtensions":["js","vue"],"snapshotSerializers":["jest-serializer-vue"],"transform":{"^.+\\.js$":"babel-jest","^.+\\.vue$":"vue-jest"}},"scripts":{"lint":"eslint .","test":"jest --coverage && cat ./coverage/lcov.info | coveralls","test-watch":"jest --watch","test-coverage":"jest --coverage","precommit":"npm run lint && npm run test"},"repository":{"type":"git","url":"git+https://github.com/wagerfield/vue-fela.git"},"bugs":{"url":"https://github.com/wagerfield/vue-fela/issues"},"dependencies":{"fela-dom":"^7.0.4"},"peerDependencies":{"fela":"^6.1.3"},"devDependencies":{"babel-core":"^6.26.0","babel-jest":"^22.1.0","babel-preset-env":"^1.6.1","coveralls":"^3.0.0","eslint":"^4.16.0","eslint-config-supermind":"^0.48.0","fela":"^6.1.3","husky":"^0.14.3","jest":"^22.1.4","jest-serializer-vue":"^0.3.0","vue":"^2.5.13","vue-jest":"^1.4.0","vue-server-renderer":"^2.5.13","vue-template-compiler":"^2.5.13","vue-test-utils":"^1.0.0-beta.11"},"gitHead":"f9d8e7437952c3dccd849126a9ada0dca345da62","_id":"vue-fela@2.0.0","_npmVersion":"5.6.0","_nodeVersion":"9.4.0","_npmUser":{"name":"wagerfield","email":"matthew@wagerfield.com"},"dist":{"integrity":"sha512-b1H9QemX2AaGyQfEQdSjL9XfMA9VNZVUfv3XYHGJzALvw8gQYPuDylvBS1ETmnutpBteVoqwp6Ga9hC4CHR0tA==","shasum":"eab355bb0b040fcb4a0531b55ee3a54830bee623","tarball":"https://registry.npmjs.org/vue-fela/-/vue-fela-2.0.0.tgz","fileCount":10,"unpackedSize":19815,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIH7RDc7VuvTpx6N+qtIv75/e8L0JdADTwhFwF+2EOwswAiEA64xrfc1VOtIzJi+Cd834K4TqNV0ZxkQvTfdLHxupX2A="}]},"maintainers":[{"name":"dustin-h","email":"dustin.hoffner@gmail.com"},{"name":"wagerfield","email":"matthew@wagerfield.com"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/vue-fela_2.0.0_1518442270782_0.6293269215567219"},"_hasShrinkwrap":false},"2.1.0":{"name":"vue-fela","version":"2.1.0","description":"Vue Fela Plugin","homepage":"https://github.com/wagerfield/vue-fela#readme","author":{"name":"Matthew Wagerfield","email":"matthew@wagerfield.com"},"license":"MIT","keywords":["vue","fela","plugin"],"files":["index.js","lib"],"main":"index.js","jest":{"mapCoverage":true,"moduleFileExtensions":["js","vue"],"snapshotSerializers":["jest-serializer-vue"],"transform":{"^.+\\.js$":"babel-jest","^.+\\.vue$":"vue-jest"}},"scripts":{"lint":"eslint .","test":"jest --coverage && cat ./coverage/lcov.info | coveralls","test-watch":"jest --watch","test-coverage":"jest --coverage","precommit":"npm run lint && npm run test"},"repository":{"type":"git","url":"git+https://github.com/wagerfield/vue-fela.git"},"bugs":{"url":"https://github.com/wagerfield/vue-fela/issues"},"dependencies":{"fela-dom":"^7.0.4"},"peerDependencies":{"fela":"^6.1.3"},"devDependencies":{"babel-core":"^6.26.0","babel-jest":"^22.1.0","babel-preset-env":"^1.6.1","coveralls":"^3.0.0","eslint":"^4.16.0","eslint-config-supermind":"^0.48.0","fela":"^6.1.3","husky":"^0.14.3","jest":"^22.1.4","jest-serializer-vue":"^0.3.0","vue":"^2.5.13","vue-jest":"^1.4.0","vue-server-renderer":"^2.5.13","vue-template-compiler":"^2.5.13","vue-test-utils":"^1.0.0-beta.11"},"gitHead":"4d11d5b837f39d53c45c75064f79b7845fb57635","_id":"vue-fela@2.1.0","_npmVersion":"5.6.0","_nodeVersion":"9.4.0","_npmUser":{"name":"wagerfield","email":"matthew@wagerfield.com"},"dist":{"integrity":"sha512-MKsFnhu6g8rhGBwFTSq4ND+AQ5wARl5XL3RXngq9fNTQOfuzegkBjW80Dtxq18iz3lfYX7GUm2Z6oUQ8ch8UKQ==","shasum":"103fdd0dc08b7a96843cf0816b7fc1cc8238948e","tarball":"https://registry.npmjs.org/vue-fela/-/vue-fela-2.1.0.tgz","fileCount":10,"unpackedSize":20005,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEMCHzpw3uxybspyWxSFLDfZLeTz/kW4g33eKFnsLoaXJroCIGdJ812U9hl9DpPEZSqPkbIVT/p7CN+hkru4Pk/ykd6i"}]},"maintainers":[{"name":"dustin-h","email":"dustin.hoffner@gmail.com"},{"name":"wagerfield","email":"matthew@wagerfield.com"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/vue-fela_2.1.0_1519220845573_0.04680089189610159"},"_hasShrinkwrap":false},"2.2.0":{"name":"vue-fela","version":"2.2.0","description":"Vue Fela Plugin","homepage":"https://github.com/wagerfield/vue-fela#readme","author":{"name":"Matthew Wagerfield","email":"matthew@wagerfield.com"},"license":"MIT","keywords":["vue","fela","plugin"],"files":["index.js","lib"],"main":"index.js","jest":{"mapCoverage":true,"moduleFileExtensions":["js","vue"],"snapshotSerializers":["jest-serializer-vue"],"transform":{"^.+\\.js$":"babel-jest","^.+\\.vue$":"vue-jest"}},"scripts":{"lint":"eslint .","test":"jest --coverage && cat ./coverage/lcov.info | coveralls","test-watch":"jest --watch","test-coverage":"jest --coverage","precommit":"npm run lint && npm run test"},"repository":{"type":"git","url":"git+https://github.com/wagerfield/vue-fela.git"},"bugs":{"url":"https://github.com/wagerfield/vue-fela/issues"},"dependencies":{"fela-dom":"^7.0.4"},"peerDependencies":{"fela":"^6.1.3"},"devDependencies":{"babel-core":"^6.26.0","babel-jest":"^22.1.0","babel-preset-env":"^1.6.1","coveralls":"^3.0.0","eslint":"^4.16.0","eslint-config-supermind":"^0.48.0","fela":"^6.1.3","husky":"^0.14.3","jest":"^22.1.4","jest-serializer-vue":"^0.3.0","vue":"^2.5.13","vue-jest":"^1.4.0","vue-server-renderer":"^2.5.13","vue-template-compiler":"^2.5.13","vue-test-utils":"^1.0.0-beta.11"},"gitHead":"90c6ce8cf389581df27fe265b39243d28481a17a","_id":"vue-fela@2.2.0","_npmVersion":"5.6.0","_nodeVersion":"9.4.0","_npmUser":{"name":"wagerfield","email":"matthew@wagerfield.com"},"dist":{"integrity":"sha512-Ai1+fhn2+Q95I64bfi+pSxc1ywrprMMoQ11X4jOL/X3X3cA+WZo3Fv67K/7bvHSsu12Lb1uabzleYI62oY1epg==","shasum":"7cd2d3f3f3f35e4eed31fc2b3a2b35cbf2cbd89e","tarball":"https://registry.npmjs.org/vue-fela/-/vue-fela-2.2.0.tgz","fileCount":10,"unpackedSize":22645,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCdnnTd6G3548PrKdqD8QrFDxJEEjuwda6oGNCmqptM9AIgajNuy0zxXPWjS5Jb0/CwX422UXl8vETKwEhPbY2q15Q="}]},"maintainers":[{"name":"dustin-h","email":"dustin.hoffner@gmail.com"},{"name":"wagerfield","email":"matthew@wagerfield.com"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/vue-fela_2.2.0_1519310346179_0.17379050396731954"},"_hasShrinkwrap":false},"2.3.0":{"name":"vue-fela","version":"2.3.0","description":"Vue Fela Plugin","homepage":"https://github.com/wagerfield/vue-fela#readme","author":{"name":"Matthew Wagerfield","email":"matthew@wagerfield.com"},"license":"MIT","keywords":["vue","fela","plugin"],"files":["index.js","lib"],"main":"index.js","jest":{"mapCoverage":true,"moduleFileExtensions":["js","vue"],"snapshotSerializers":["jest-serializer-vue"],"transform":{"^.+\\.js$":"babel-jest","^.+\\.vue$":"vue-jest"}},"scripts":{"lint":"eslint .","test":"jest --coverage && cat ./coverage/lcov.info | coveralls","test-watch":"jest --watch","test-coverage":"jest --coverage","precommit":"npm run lint && npm run test"},"repository":{"type":"git","url":"git+https://github.com/wagerfield/vue-fela.git"},"bugs":{"url":"https://github.com/wagerfield/vue-fela/issues"},"dependencies":{"fela-dom":"^7.0.4"},"peerDependencies":{"fela":"^6.1.3"},"devDependencies":{"babel-core":"^6.26.0","babel-jest":"^22.1.0","babel-preset-env":"^1.6.1","coveralls":"^3.0.0","eslint":"^4.16.0","eslint-config-supermind":"^0.48.0","fela":"^6.1.3","husky":"^0.14.3","jest":"^22.1.4","jest-serializer-vue":"^0.3.0","vue":"^2.5.13","vue-jest":"^1.4.0","vue-server-renderer":"^2.5.13","vue-template-compiler":"^2.5.13","vue-test-utils":"^1.0.0-beta.11"},"gitHead":"536c107dff3b83a6efe3bcda91bbaae2052c20dd","_id":"vue-fela@2.3.0","_npmVersion":"5.6.0","_nodeVersion":"9.4.0","_npmUser":{"name":"wagerfield","email":"matthew@wagerfield.com"},"dist":{"integrity":"sha512-mxK8GjAooPOwiryzBUgw1F2wyIHrcDlc8V7VDRt/B3NQJZsqXLdjMvf0RsV4mc2uvrGc4wjWLnlQAInRRlVl8g==","shasum":"0623b8399181387395071ef41a24541b1ce78f26","tarball":"https://registry.npmjs.org/vue-fela/-/vue-fela-2.3.0.tgz","fileCount":10,"unpackedSize":25822,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCICW+eQcVAavKvrdi71nKBVIAwPzDQgnsNpcSVq3HKFnvAiBbBCqz+N9VZCjo3XsP37LVYo3PE34RmQv8ItPR0wEvJQ=="}]},"maintainers":[{"name":"dustin-h","email":"dustin.hoffner@gmail.com"},{"name":"wagerfield","email":"matthew@wagerfield.com"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/vue-fela_2.3.0_1519766231170_0.9115134824238886"},"_hasShrinkwrap":false},"2.3.1":{"name":"vue-fela","version":"2.3.1","description":"Vue Fela Plugin","homepage":"https://github.com/wagerfield/vue-fela#readme","author":{"name":"Matthew Wagerfield","email":"matthew@wagerfield.com"},"license":"MIT","keywords":["vue","fela","plugin"],"files":["index.js","lib"],"main":"index.js","jest":{"mapCoverage":true,"moduleFileExtensions":["js","vue"],"snapshotSerializers":["jest-serializer-vue"],"transform":{"^.+\\.js$":"babel-jest","^.+\\.vue$":"vue-jest"}},"scripts":{"lint":"eslint .","test":"jest --coverage && cat ./coverage/lcov.info | coveralls","test-watch":"jest --watch","test-coverage":"jest --coverage","precommit":"npm run lint && npm run test"},"repository":{"type":"git","url":"git+https://github.com/wagerfield/vue-fela.git"},"bugs":{"url":"https://github.com/wagerfield/vue-fela/issues"},"dependencies":{"fela-dom":"^7.0.4"},"peerDependencies":{"fela":"^6.1.3"},"devDependencies":{"babel-core":"^6.26.0","babel-jest":"^22.1.0","babel-preset-env":"^1.6.1","coveralls":"^3.0.0","eslint":"^4.16.0","eslint-config-supermind":"^0.48.0","fela":"^6.1.3","husky":"^0.14.3","jest":"^22.1.4","jest-serializer-vue":"^0.3.0","vue":"^2.5.13","vue-jest":"^1.4.0","vue-server-renderer":"^2.5.13","vue-template-compiler":"^2.5.13","vue-test-utils":"^1.0.0-beta.11"},"gitHead":"62e14ee52a5bcb88ca58b026aba1ef50eebac379","_id":"vue-fela@2.3.1","_npmVersion":"5.6.0","_nodeVersion":"9.4.0","_npmUser":{"name":"wagerfield","email":"matthew@wagerfield.com"},"dist":{"integrity":"sha512-yWEP9UyJCEh4Dp+H65MAdrX3d3YEyKFdIvWIWz4I518bRiu6KpQE+JUIiczrWSicueDXHj036SQ1GC7KAqasMQ==","shasum":"b81c1b12c212c1ab5165a2e1ff8d23bb2f0ea133","tarball":"https://registry.npmjs.org/vue-fela/-/vue-fela-2.3.1.tgz","fileCount":10,"unpackedSize":25806,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIFhg5N7Hxl9ZyjLPCyFT1SHtg3JeUgyBApAQReiMWk0rAiEAjkJ9JCoFgp3iZ5ViRNTXL0g/UMTAZZXkP9rv180DObE="}]},"maintainers":[{"name":"dustin-h","email":"dustin.hoffner@gmail.com"},{"name":"wagerfield","email":"matthew@wagerfield.com"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/vue-fela_2.3.1_1519767354586_0.5747990915044965"},"_hasShrinkwrap":false},"2.4.0":{"name":"vue-fela","version":"2.4.0","description":"Vue Fela Plugin","homepage":"https://github.com/wagerfield/vue-fela#readme","author":{"name":"Matthew Wagerfield","email":"matthew@wagerfield.com"},"license":"MIT","keywords":["vue","fela","plugin"],"files":["index.js","lib"],"main":"index.js","jest":{"mapCoverage":true,"moduleFileExtensions":["js","vue"],"snapshotSerializers":["jest-serializer-vue"],"transform":{"^.+\\.js$":"babel-jest","^.+\\.vue$":"vue-jest"}},"scripts":{"lint":"eslint .","test":"jest --coverage && cat ./coverage/lcov.info | coveralls","test-watch":"jest --watch","test-coverage":"jest --coverage","precommit":"npm run lint && npm run test"},"repository":{"type":"git","url":"git+https://github.com/wagerfield/vue-fela.git"},"bugs":{"url":"https://github.com/wagerfield/vue-fela/issues"},"dependencies":{"fela-dom":"^7.0.4"},"peerDependencies":{"fela":"^6.1.3"},"devDependencies":{"babel-core":"^6.26.0","babel-jest":"^22.1.0","babel-preset-env":"^1.6.1","coveralls":"^3.0.0","eslint":"^4.16.0","eslint-config-supermind":"^0.48.0","fela":"^6.1.3","husky":"^0.14.3","jest":"^22.1.4","jest-serializer-vue":"^0.3.0","vue":"^2.5.13","vue-jest":"^1.4.0","vue-server-renderer":"^2.5.13","vue-template-compiler":"^2.5.13","vue-test-utils":"^1.0.0-beta.11"},"gitHead":"804b97d78694fda4f18c765361ed1f0eeb441d42","_id":"vue-fela@2.4.0","_npmVersion":"5.6.0","_nodeVersion":"9.4.0","_npmUser":{"name":"wagerfield","email":"matthew@wagerfield.com"},"dist":{"integrity":"sha512-Pzc7b+IOS06BvOCG0CWnHN7uvHORiajzpbIctzvUhHjxNDT2yD2aQAXSi/uFHGvGGZ2RhS4ICVhpCyl5ZBNLaQ==","shasum":"a46ed0078364de84f761c10ec319fb7baeec26b2","tarball":"https://registry.npmjs.org/vue-fela/-/vue-fela-2.4.0.tgz","fileCount":10,"unpackedSize":25764,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDSdZlMJKc5EhNYF+Iinh0kH4Oaq4swZOSkTam65X8nVQIgFNJJ9JQHH9+A/XrTADBHvVjWSiit24lUy17u7QxQ3Fc="}]},"maintainers":[{"name":"dustin-h","email":"dustin.hoffner@gmail.com"},{"name":"wagerfield","email":"matthew@wagerfield.com"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/vue-fela_2.4.0_1519851127956_0.7257634435366116"},"_hasShrinkwrap":false},"2.5.0":{"name":"vue-fela","version":"2.5.0","description":"Vue Fela Plugin","homepage":"https://github.com/wagerfield/vue-fela#readme","author":{"name":"Matthew Wagerfield","email":"matthew@wagerfield.com"},"license":"MIT","keywords":["vue","fela","plugin"],"files":["index.js","lib"],"main":"index.js","jest":{"mapCoverage":true,"moduleFileExtensions":["js","vue"],"snapshotSerializers":["jest-serializer-vue"],"transform":{"^.+\\.js$":"babel-jest","^.+\\.vue$":"vue-jest"}},"scripts":{"lint":"eslint .","test":"jest --coverage && cat ./coverage/lcov.info | coveralls","test-watch":"jest --watch","test-coverage":"jest --coverage","precommit":"npm run lint && npm run test"},"repository":{"type":"git","url":"git+https://github.com/wagerfield/vue-fela.git"},"bugs":{"url":"https://github.com/wagerfield/vue-fela/issues"},"dependencies":{"fela-dom":"^7.0.4"},"peerDependencies":{"fela":"^6.1.3"},"devDependencies":{"babel-core":"^6.26.0","babel-jest":"^22.1.0","babel-preset-env":"^1.6.1","coveralls":"^3.0.0","eslint":"^4.16.0","eslint-config-supermind":"^0.48.0","fela":"^6.1.3","husky":"^0.14.3","jest":"^22.1.4","jest-serializer-vue":"^0.3.0","vue":"^2.5.13","vue-jest":"^1.4.0","vue-server-renderer":"^2.5.13","vue-template-compiler":"^2.5.13","vue-test-utils":"^1.0.0-beta.11"},"gitHead":"d0a79f8cf4aa44e67b76e9784a1b43312b495bae","_id":"vue-fela@2.5.0","_npmVersion":"5.6.0","_nodeVersion":"9.4.0","_npmUser":{"name":"wagerfield","email":"matthew@wagerfield.com"},"dist":{"integrity":"sha512-GfEv+ilWDMR4CwPI5qwzQ+e2aa9zxteLULXqF9Jtk7c+pK47+pHpjqMK2gXBhRlwEjw59GuxcOFBq7vCPdjEMQ==","shasum":"7794acd94642c4fd319e8d64f96b33e34a5fe21c","tarball":"https://registry.npmjs.org/vue-fela/-/vue-fela-2.5.0.tgz","fileCount":10,"unpackedSize":25854,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIF6hoOW4urMilZ3HIErjSjc47Ggd5obg5GHpmdR8jovyAiEAu6nyScxAdv4EPFZ8beqb59edphcTe65vIM9yqK4Q4fI="}]},"maintainers":[{"name":"dustin-h","email":"dustin.hoffner@gmail.com"},{"name":"wagerfield","email":"matthew@wagerfield.com"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/vue-fela_2.5.0_1520345604260_0.6766455645031162"},"_hasShrinkwrap":false},"2.6.0":{"name":"vue-fela","version":"2.6.0","description":"Vue Fela Plugin","homepage":"https://github.com/wagerfield/vue-fela#readme","author":{"name":"Matthew Wagerfield","email":"matthew@wagerfield.com"},"license":"MIT","keywords":["vue","fela","plugin"],"files":["index.js","lib"],"main":"index.js","jest":{"mapCoverage":true,"moduleFileExtensions":["js","vue"],"snapshotSerializers":["jest-serializer-vue"],"transform":{"^.+\\.js$":"babel-jest","^.+\\.vue$":"vue-jest"}},"scripts":{"lint":"eslint .","test":"jest --coverage && cat ./coverage/lcov.info | coveralls","test-watch":"jest --watch","test-coverage":"jest --coverage","precommit":"npm run lint && npm run test"},"repository":{"type":"git","url":"git+https://github.com/wagerfield/vue-fela.git"},"bugs":{"url":"https://github.com/wagerfield/vue-fela/issues"},"dependencies":{"fela-dom":"^7.0.4"},"peerDependencies":{"fela":"^6.1.3"},"devDependencies":{"babel-core":"^6.26.0","babel-jest":"^22.1.0","babel-preset-env":"^1.6.1","coveralls":"^3.0.0","eslint":"^4.16.0","eslint-config-supermind":"^0.48.0","fela":"^6.1.3","husky":"^0.14.3","jest":"^22.1.4","jest-serializer-vue":"^0.3.0","vue":"^2.5.13","vue-jest":"^1.4.0","vue-server-renderer":"^2.5.13","vue-template-compiler":"^2.5.13","vue-test-utils":"^1.0.0-beta.11"},"gitHead":"45f9a24d2447a1def34830cf923ceed6027dc37c","_id":"vue-fela@2.6.0","_npmVersion":"5.6.0","_nodeVersion":"9.4.0","_npmUser":{"name":"wagerfield","email":"matthew@wagerfield.com"},"dist":{"integrity":"sha512-BE5YUphBQ237x+CQhGS0+18ieUt8PB9a3z7m2UHSMx+TvM8Zf0xGBYR61HN5BwIfiQcPmx75N9C+F0UMo7yfrA==","shasum":"4bb914a974a1d88f9abe04c0dc89deaca8a5fdb7","tarball":"https://registry.npmjs.org/vue-fela/-/vue-fela-2.6.0.tgz","fileCount":10,"unpackedSize":25984,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIFMUNY24Zuty7MMbK8INLEx5FEuk7s5wnIsN0lhxuD0WAiEAtaFnqofex/fhtgGWdA3yyTuLSp01bc8rP1D6WOPvo0Y="}]},"maintainers":[{"name":"dustin-h","email":"dustin.hoffner@gmail.com"},{"name":"wagerfield","email":"matthew@wagerfield.com"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/vue-fela_2.6.0_1520856505448_0.6631510130806022"},"_hasShrinkwrap":false},"2.6.1":{"name":"vue-fela","version":"2.6.1","description":"Vue Fela Plugin","homepage":"https://github.com/wagerfield/vue-fela#readme","author":{"name":"Matthew Wagerfield","email":"matthew@wagerfield.com"},"license":"MIT","keywords":["vue","fela","plugin"],"files":["index.js","lib"],"main":"index.js","jest":{"mapCoverage":true,"moduleFileExtensions":["js","vue"],"snapshotSerializers":["jest-serializer-vue"],"transform":{"^.+\\.js$":"babel-jest","^.+\\.vue$":"vue-jest"}},"scripts":{"lint":"eslint .","test":"jest --coverage && cat ./coverage/lcov.info | coveralls","test-watch":"jest --watch","test-coverage":"jest --coverage","precommit":"npm run lint && npm run test"},"repository":{"type":"git","url":"git+https://github.com/wagerfield/vue-fela.git"},"bugs":{"url":"https://github.com/wagerfield/vue-fela/issues"},"dependencies":{"fela-dom":"^7.0.4"},"peerDependencies":{"fela":"^6.1.3"},"devDependencies":{"babel-core":"^6.26.0","babel-jest":"^22.1.0","babel-preset-env":"^1.6.1","coveralls":"^3.0.0","eslint":"^4.16.0","eslint-config-supermind":"^0.48.0","fela":"^6.1.3","husky":"^0.14.3","jest":"^22.1.4","jest-serializer-vue":"^0.3.0","vue":"^2.5.13","vue-jest":"^1.4.0","vue-server-renderer":"^2.5.13","vue-template-compiler":"^2.5.13","vue-test-utils":"^1.0.0-beta.11"},"gitHead":"1e0aaa93da9c7451539eaf64c523785929b4d524","_id":"vue-fela@2.6.1","_npmVersion":"5.6.0","_nodeVersion":"9.4.0","_npmUser":{"name":"wagerfield","email":"matthew@wagerfield.com"},"maintainers":[{"name":"dustin-h","email":"dustin.hoffner@gmail.com"},{"name":"wagerfield","email":"matthew@wagerfield.com"}],"dist":{"integrity":"sha512-WGfq3faztP8Eh4TK8DK4Zx+IvOdr8oIz5qtkGfybxXXyS9ZCrxBzBxeU9BB5F53VRnAxp0uyUEB8IAYoLb07gQ==","shasum":"770dfc1554fde0153a855df40ef4eb803e18041d","tarball":"https://registry.npmjs.org/vue-fela/-/vue-fela-2.6.1.tgz","fileCount":10,"unpackedSize":25984,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIAw0R4pzdLyVr4U5UpgyA3oj1Jz/ztpjJLrXwAc3ZPESAiBnB/FuE78/khU/JpTLNZDjcft4H3xbpxgvSvRbRoRO8Q=="}]},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/vue-fela_2.6.1_1520867442976_0.8823340949549618"},"_hasShrinkwrap":false},"2.7.0":{"name":"vue-fela","version":"2.7.0","description":"Vue Fela Plugin","homepage":"https://github.com/wagerfield/vue-fela#readme","author":{"name":"Matthew Wagerfield","email":"matthew@wagerfield.com"},"license":"MIT","keywords":["vue","fela","plugin"],"files":["index.js","lib"],"main":"index.js","jest":{"mapCoverage":true,"moduleFileExtensions":["js","vue"],"snapshotSerializers":["jest-serializer-vue"],"transform":{"^.+\\.js$":"babel-jest","^.+\\.vue$":"vue-jest"}},"scripts":{"lint":"eslint .","test":"jest --coverage && cat ./coverage/lcov.info | coveralls","test-watch":"jest --watch","test-coverage":"jest --coverage","precommit":"npm run lint && npm run test"},"repository":{"type":"git","url":"git+https://github.com/wagerfield/vue-fela.git"},"bugs":{"url":"https://github.com/wagerfield/vue-fela/issues"},"dependencies":{"fast-loops":"^1.0.0","fela-dom":"^7.0.4","isarray":"^2.0.4","isobject":"^3.0.1"},"peerDependencies":{"fela":"^6.1.3"},"devDependencies":{"babel-core":"^6.26.0","babel-jest":"^22.1.0","babel-preset-env":"^1.6.1","coveralls":"^3.0.0","eslint":"^4.16.0","eslint-config-supermind":"^0.48.0","fela":"^6.1.3","husky":"^0.14.3","jest":"^22.1.4","jest-serializer-vue":"^0.3.0","vue":"^2.5.13","vue-jest":"^1.4.0","vue-server-renderer":"^2.5.13","vue-template-compiler":"^2.5.13","vue-test-utils":"^1.0.0-beta.11"},"gitHead":"64a6cdf56b37bd3cea6fc7c3ec18e468e3e564e4","_id":"vue-fela@2.7.0","_npmVersion":"5.6.0","_nodeVersion":"9.4.0","_npmUser":{"name":"wagerfield","email":"matthew@wagerfield.com"},"maintainers":[{"name":"dustin-h","email":"dustin.hoffner@gmail.com"},{"name":"wagerfield","email":"matthew@wagerfield.com"}],"dist":{"integrity":"sha512-zmYS+jVmpRwHLj+tqhOhz0VcauWv62+qFwRUr5VX1S3lJdPmRZDDTNPIylHmXsrES5oOaBSXf19KBguqswRAhw==","shasum":"e57b0cbe408e5d1b14ea65fd157baa2f4fcefdbc","tarball":"https://registry.npmjs.org/vue-fela/-/vue-fela-2.7.0.tgz","fileCount":9,"unpackedSize":25121,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIE/vU9Z9c2u9nOcTJlat9Tbrg3MHkxsOl25poqAtHG2nAiAzMvxP4aC7oDnVrwdyKSdQXQedAYAIlDYsKFkFobs/SQ=="}]},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/vue-fela_2.7.0_1521461413913_0.22813402283618278"},"_hasShrinkwrap":false},"3.0.0":{"name":"vue-fela","version":"3.0.0","description":"Vue Fela Plugin","homepage":"https://github.com/wagerfield/vue-fela#readme","author":{"name":"Matthew Wagerfield","email":"matthew@wagerfield.com"},"license":"MIT","keywords":["vue","fela","plugin"],"files":["index.js","lib"],"main":"index.js","jest":{"mapCoverage":true,"moduleFileExtensions":["js","vue"],"snapshotSerializers":["jest-serializer-vue"],"transform":{"^.+\\.js$":"babel-jest","^.+\\.vue$":"vue-jest"}},"scripts":{"lint":"eslint .","test":"jest --coverage && cat ./coverage/lcov.info | coveralls","test-watch":"jest --watch","test-coverage":"jest --coverage","precommit":"npm run lint && npm run test"},"repository":{"type":"git","url":"git+https://github.com/wagerfield/vue-fela.git"},"bugs":{"url":"https://github.com/wagerfield/vue-fela/issues"},"dependencies":{"fast-loops":"^1.0.0","fela-dom":"^7.0.4","isarray":"^2.0.4","isobject":"^3.0.1"},"peerDependencies":{"fela":"^6.1.3"},"devDependencies":{"babel-core":"^6.26.0","babel-jest":"^22.1.0","babel-preset-env":"^1.6.1","coveralls":"^3.0.0","eslint":"^4.16.0","eslint-config-supermind":"^0.48.0","fela":"^6.1.3","husky":"^0.14.3","jest":"^22.1.4","jest-serializer-vue":"^0.3.0","vue":"^2.5.13","vue-jest":"^1.4.0","vue-server-renderer":"^2.5.13","vue-template-compiler":"^2.5.13","vue-test-utils":"^1.0.0-beta.11"},"readme":"# [Fela][fela] plugin for [Vue][vue]\n\n![build](https://img.shields.io/travis/wagerfield/vue-fela.svg)\n![coveralls](https://img.shields.io/coveralls/github/wagerfield/vue-fela.svg)\n![issues](https://img.shields.io/github/issues/wagerfield/vue-fela.svg)\n![license](https://img.shields.io/github/license/wagerfield/vue-fela.svg)\n\n- [Installation](#installation)\n- [Usage](#usage)\n - [Rendering Rules](#rendering-rules)\n - [mapRule(rule, optProps)](#map-rule)\n - [mapRules(rules, optMap, optProps)](#map-rules)\n - [mapStyles(rules, optMap, optProps)](#map-styles)\n - [renderRule(renderer, rule, props)](#render-rule)\n - [renderRules(renderer, rules, props, optMap)](#render-rules)\n - [Rendering Styles](#rendering-styles)\n - [Plugin Options](#plugin-options)\n - [Universal Rendering](#universal-rendering)\n - [Nuxt Example](#nuxt-example)\n- [Tests](#tests)\n\n## Installation\n\n```bash\nyarn add vue-fela\n```\n\n## Usage\n\n```js\nimport Vue from 'vue'\nimport VueFela from 'vue-fela'\nimport { createRenderer } from 'fela'\n\n// 1. Create a Fela renderer\nconst renderer = createRenderer()\n\n// 2. Install the plugin and pass the renderer as an option\nVue.use(VueFela, { renderer })\n```\n\nWhen the plugin is installed, a `$fela` property is set on Vue's `prototype` making it available on each component instance. The `$fela` property provides a reference to the [Fela Renderer][fela-renderer] instance that was passed as an option when the plugin was installed.\n\nThe Fela Renderer instance is also [provided][vue-provide-inject] through the `inject` interface on a `fela` key. This allows you to access the renderer within [functional Vue components][vue-functional].\n\n**Check out a full working [example using Nuxt](example).**\n\n## Rendering Rules\n\nSince a [Fela Renderer][fela-renderer] instance is assigned to Vue's `prototype`, you can reference and use within a Vue component via `this.$fela`.\n\nSee the [Single File Component][vue-sfc] example below:\n\n```vue\n\n\n\n```\n\nIn the example above, we are passing `this` as the rule's `props` to Fela's `renderRule` function. Doing so will give the rule access to all the component instance properties such as `color` to derive the styles.\n\nYou can of course pass any arbitrary `props` object as the second argument to `renderRule`.\n\n\n\n### mapRule(rule, optProps)\n\nTo save having to define a computed prop function and return `this.$fela.renderRule(rule, props)` each time, a `mapRule` helper is provided:\n\n```vue\n\n\n\n```\n\nPassing `optProps` as the second argument to `mapRule` is _optional_.\n\nIf `optProps` is omitted (like in the example above) then the Vue component instance will be passed by default. Typically this is the desired behaviour since a component's styles will generally want to be the result of its state.\n\nIn the example above, the `color` prop can be configured by a parent component. This value will then be available within the component instance via `this.color`. If `color` is not set by the parent component, it will default to 'red' since we have set the `default` field in the `props` color definition.\n\nAs you might expect, _all properties and methods_ on a Vue component instance can be used within a rule:\n\n- `props` values set by parent components\n- `data` values set when the component is initialised\n- `computed` values derived from other properties and state\n- `methods` that return values\n\nSince the class names being returned from `mapRule` are assigned to the component's `computed` props object, any change in state referenced by a rule will trigger an update and return new class names.\n\n\n\n### mapRules(rules, optMap, optProps)\n\nTaking it one step further, the `mapRules` helper repeats the work of `mapRule`—but expects an object map of `rules` rather than a single `rule` function:\n\n```vue\n\n\n\n```\n\nWriting all your rules in a component can start to get a little cumbersome, so you might want to consider breaking them out into a separate file:\n\n```js\n// component-rules.js\nexport default {\n container: ({ highlight, textAlign }) => ({\n backgroundColor: highlight ? '#DDF' : '#DDD',\n padding: 16,\n textAlign\n }),\n heading: ({ highlight }) => ({\n fontWeight: highlight ? 700 : 400,\n fontSize: 24\n }),\n body: ({ highlight }) => ({\n color: highlight ? '#08F' : '#888',\n fontSize: 16\n })\n}\n```\n\n...and then `import` them into your Vue component:\n\n```vue\n\n\n\n```\n\nCalling `mapRules(rules, optMap, optProps)` with no `optMap` argument will result in all `rules` being returned and assigned to the component's `computed` props.\n\nIn the example above, this would assign `container`, `heading` and `body` to the component's `computed` props. These 3 props can then be used as class names on the 3 respective elements in the template.\n\nThis behaviour might not always be desirable, so `mapRules` provides another level of control with the `optMap` argument.\n\nIf you have used [Vuex's mapping helpers][vuex-helpers] the following interface should look familiar to you.\n\n#### optMap\n\nThe `optMap` argument can either be:\n\n1. An Array of Strings where:\n - String values are the names of the rules to include in the object that is returned\n - This allows you to filter out only the rules you require\n - It does not allow you to rename the rules\n2. An Object of key values where:\n - Keys are aliases to use as the computed prop names in the object that is returned\n - Values are the names of the rules in the object map\n - This allows you to both filter and rename rules\n\nFor example, using the same component and rules map from the example above:\n\n```vue\n\n\n\n```\n\nIn the example above you can see that we have used the [object spread operator][object-spread] to merge multiple calls to `mapRules` onto the component's `computed` props object. We have also omitted the `body` rule from the `component-rules.js` map.\n\n#### optProps\n\nFinally, much like the `mapRule` helper, `optProps` can be passed as the _third argument_ to `mapRules`. Omitting `optProps` will result in the component instance being passed to each of the rules as the `props` argument by default.\n\n\n\n### mapStyles(rules, optMap, optProps)\n\nIf your component has properties that clash with your rule names when mapping them to the `computed` object—you have a couple of options:\n\n1. Pass an `optMap` argument to `mapRules` to alias your rule names to different ones eg. `iconClass: 'icon'`\n2. Use a naming convention for all your rules that separates them from your component `props` eg. `iconRule` or `iconClass`\n\nThe first option requires more code in your components. The second option compromises the precise naming of your rules. Neither options are ideal.\n\nAs a third option you can use the `mapStyles` helper.\n\nThis helper works in _exactly the same way_ as `mapRules`, but rather than returning an object map of computed prop functions, it returns a single computed function.\n\nThe computed function returned from the `mapStyles` helper will then return an object map of class names that are the result of rendering your `rules`.\n\nThis allows you to assign all your rules to a single `computed` property eg. `styles` and render the result of each rule within your template using dot syntax eg. `styles.icon`:\n\n```vue\n\n\n\n```\n\nThe function signature of `mapStyles(rules, optMap, optProps)` is identical to `mapRules(rules, optMap, optProps)`.\n\n[Read the documentation](#optmap) on `optMap` and `optProps` above.\n\n\n\n### renderRule(renderer, rule, props)\n\nWhen creating [functional Vue components][vue-functional] you can `inject` the Fela Renderer instance via the `fela` key:\n\n```js\nexport default {\n functional: true,\n inject: [ 'fela' ],\n render(h, { data, children, injections }) {\n // Reference to Fela Renderer instance\n const renderer = injections.fela\n return h('span', data, children)\n }\n}\n```\n\nTo render a single Fela `rule` you can either use the Fela Renderer instance's `renderRule` method directly or you can use the `renderRule` helper provided by Vue Fela. They do exactly the same thing—this is just a matter of style:\n\n```js\nimport { renderRule } from 'vue-fela'\n\nconst rule = ({ size }) => ({ width: size, height: size })\n\nexport default {\n functional: true,\n inject: [ 'fela' ],\n props: { size: Number },\n render(h, { props, children, injections }) {\n const renderer = injections.fela\n // The following 2 lines return exactly the same value\n const class1 = renderRule(renderer, rule, props)\n const class2 = renderer.renderRule(rule, props)\n // class1 === class2\n return h('span', {\n class: [ class1, class2 ] // a b\n }, children)\n }\n}\n```\n\n\n\n### renderRules(renderer, rules, props, optMap)\n\nWhen using an object map of `rules` within a [functional Vue component][vue-functional] you can use the `renderRules` helper provided by Vue Fela:\n\n```js\nimport { renderRules } from 'vue-fela'\n\nconst rules = {\n container: ({ fillColor }) => ({\n backgroundColor: fillColor,\n padding: '8px'\n }),\n text: ({ textColor }) => ({\n color: textColor,\n fontSize: '16px'\n }),\n}\n\nexport default {\n functional: true,\n inject: [ 'fela' ],\n props: {\n fillColor: String,\n textColor: String\n },\n render(h, { props, children, injections }) {\n const renderer = injections.fela\n const styles = renderRules(renderer, rules, props)\n return h('div', {\n class: styles.container\n }, [\n h('span', {\n class: styles.text\n }, children)\n ])\n }\n}\n```\n\nYou can also optionally pass `optMap` as the final argument to the `renderRules` helper.\n\nThis works in exactly the same way as [documented above](#optmap) in the `mapRules` helper.\n\n## Rendering Styles\n\nTo render the styles cached by the Fela Renderer we need to use `fela-dom`.\n\nHowever, since Fela works on both the [client][fela-client] and the [server][fela-server], the method for rendering the cached styles differs between environments.\n\nTo simplify this, `VueFela` handles the logic of determining what to do in each environment automatically.\n\n### Plugin Options\n\nYou can disable automatic rendering via the plugin options when installing `VueFela`:\n\n```js\nimport Vue from 'vue'\nimport VueFela from 'vue-fela'\nimport { createRenderer } from 'fela'\nimport { render } from 'fela-dom'\n\nconst renderer = createRenderer()\n\nVue.use(VueFela, {\n renderer, // required\n autoRender: false\n})\n\nrender(renderer)\n```\n\nOptions that can be configured when the plugin is installed are as follows:\n\nOption | Type | Default | Description\n----------|------|---------|------------\n`renderer` | `Object` | | [Fela Renderer][fela-renderer] instance. **Required**\n`autoRender` | `Boolean` | `true` | Enable/disable automatic rendering. When set to `false` the `ssr`, `metaKeyName` and `metaTagId` properties are ignored\n`ssr` | `Boolean` | `true` | Enable/disable SSR\n`metaKeyName` | `String` | `head` | Vue Meta `keyName` [option][vue-meta-options]
This is [configured to work with Nuxt][nuxt-meta] by default\n`metaTagId` | `String` | `hid` | Vue Meta `tagIDKeyName` [option][vue-meta-options]
This is [configured to work with Nuxt][nuxt-meta] by default\n\nAn example using [Vue Meta's default values][vue-meta-options] while disabling SSR can be seen below:\n\n```js\nimport Vue from 'vue'\nimport VueFela from 'vue-fela'\nimport { createRenderer } from 'fela'\n\nVue.use(VueFela, {\n renderer: createRenderer(), // required\n metaKeyName: 'metaInfo,\n metaTagId: 'vmid',\n ssr: false\n})\n```\n\n### Universal Rendering\n\nThe easiest way to create universal Vue applications is with [Nuxt][nuxt]. Nuxt takes care of setting up the logic for rendering Vue components on the server and rehydrating them on the client.\n\nNuxt uses `vue-meta` to render and update tags in the `` of your pages. [Vue Meta][vue-meta] provides the mechanism Vue Fela needs for rendering the cached styles on the server and sending them to the client.\n\nBecause of this, the `vue-fela` plugin is configured to work with `vue-meta` using [Nuxt's configuration options][nuxt-meta] by default.\n\n### Nuxt Example\n\nTo setup Vue Fela with Nuxt you will need to create a file in the `plugins` directory:\n\n```js\n// plugins/fela.js\nimport Vue from 'vue'\nimport VueFela from 'vue-fela'\nimport { createRenderer } from 'fela'\n\n// 1. Create a Fela renderer\nconst renderer = createRenderer()\n\n// 2. Install the plugin and pass the renderer as an option\nVue.use(VueFela, { renderer })\n```\n\nThen add the plugin to Nuxt's configuration:\n\n```js\n// nuxt.config.js\nmodule.exports = {\n plugins: [\n 'plugins/fela'\n ]\n}\n```\n\n**Check out a full working [example using Nuxt](example).**\n\n## Tests\n\nTests are written using [`jest`][jest] and [`vue-test-utils`][vue-test-utils].\n\nTo run the tests after cloning the repository and installing its dependencies:\n\n```bash\nyarn test\n```\n\nTo run the tests in watch mode:\n\n```bash\nyarn test-watch\n```\n\nTo generate a coverage report:\n\n```bash\nyarn test-coverage\n```\n\n## Author\n\n[Matthew Wagerfield][twitter]\n\n## License\n\n[MIT][mit]\n\n[vue]: https://vuejs.org\n[vue-sfc]: https://vuejs.org/v2/guide/single-file-components.html\n[vue-functional]: https://vuejs.org/v2/guide/render-function.html#Functional-Components\n[vue-provide-inject]: https://vuejs.org/v2/api/#provide-inject\n[vue-before-create]: https://vuejs.org/v2/api/#beforeCreate\n\n[vue-test-utils]: https://vue-test-utils.vuejs.org\n\n[vue-meta]: https://github.com/declandewet/vue-meta\n[vue-meta-options]: https://github.com/declandewet/vue-meta#options\n\n[vuex-helpers]: https://vuex.vuejs.org/en/api.html#component-binding-helpers\n\n[fela]: http://fela.js.org\n[fela-client]: http://fela.js.org/docs/advanced/DOMRendering.html\n[fela-server]: http://fela.js.org/docs/advanced/ServerRendering.html\n[fela-renderer]: http://fela.js.org/docs/basics/Renderer.html\n\n[nuxt]:https://nuxtjs.org\n[nuxt-meta]:https://nuxtjs.org/guide/views#html-head\n\n[object-spread]: https://github.com/tc39/proposal-object-rest-spread\n\n[jest]: https://facebook.github.io/jest\n\n[mit]: https://opensource.org/licenses/MIT\n\n[twitter]: https://twitter.com/wagerfield\n","readmeFilename":"readme.md","gitHead":"18113aedc1a190a3f8794c79333674470234fa10","_id":"vue-fela@3.0.0","_npmVersion":"5.6.0","_nodeVersion":"9.4.0","_npmUser":{"name":"wagerfield","email":"matthew@wagerfield.com"},"maintainers":[{"name":"dustin-h","email":"dustin.hoffner@gmail.com"},{"name":"wagerfield","email":"matthew@wagerfield.com"}],"dist":{"integrity":"sha512-1aTmisenW7m6x3vm3Xpn3He/jnuHEjAyTGDdkIocys0argHxpYpNb7xA3YUCBcx0RzabaZR+V/hwbSfbMiMlXw==","shasum":"7b525528eee14b996892022886effec726a3a462","tarball":"https://registry.npmjs.org/vue-fela/-/vue-fela-3.0.0.tgz","fileCount":8,"unpackedSize":24984,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDBBTPNW1zs2saEJ0pZHuNkcskE/GwP8wmM4BhJOe3sdQIgb/ce6nSFYq6FItmYrs20FqyQ6NECBbGib8PIJBbg4ug="}]},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/vue-fela_3.0.0_1522164539003_0.8063380937046594"},"_hasShrinkwrap":false},"3.1.0":{"name":"vue-fela","version":"3.1.0","description":"Vue Fela Plugin","homepage":"https://github.com/wagerfield/vue-fela#readme","author":{"name":"Matthew Wagerfield","email":"matthew@wagerfield.com"},"license":"MIT","keywords":["vue","fela","plugin"],"files":["index.js","lib"],"main":"index.js","jest":{"mapCoverage":true,"moduleFileExtensions":["js","vue"],"snapshotSerializers":["jest-serializer-vue"],"transform":{"^.+\\.js$":"babel-jest","^.+\\.vue$":"vue-jest"}},"scripts":{"lint":"eslint .","test":"jest --coverage && cat ./coverage/lcov.info | coveralls","test-watch":"jest --watch","test-coverage":"jest --coverage","precommit":"npm run lint && npm run test"},"repository":{"type":"git","url":"git+https://github.com/wagerfield/vue-fela.git"},"bugs":{"url":"https://github.com/wagerfield/vue-fela/issues"},"dependencies":{"fast-loops":"^1.0.0","fela-dom":"^7.0.4","isarray":"^2.0.4","isobject":"^3.0.1"},"peerDependencies":{"fela":"^6.1.3"},"devDependencies":{"babel-core":"^6.26.0","babel-jest":"^22.1.0","babel-preset-env":"^1.6.1","coveralls":"^3.0.0","eslint":"^4.16.0","eslint-config-supermind":"^0.48.0","fela":"^6.1.3","husky":"^0.14.3","jest":"^22.1.4","jest-serializer-vue":"^0.3.0","vue":"^2.5.13","vue-jest":"^1.4.0","vue-server-renderer":"^2.5.13","vue-template-compiler":"^2.5.13","vue-test-utils":"^1.0.0-beta.11"},"gitHead":"fc72398ee3d450de1e9f6c349ead572dda8776a2","_id":"vue-fela@3.1.0","_npmVersion":"5.6.0","_nodeVersion":"9.4.0","_npmUser":{"name":"wagerfield","email":"matthew@wagerfield.com"},"maintainers":[{"name":"dustin-h","email":"dustin.hoffner@gmail.com"},{"name":"wagerfield","email":"matthew@wagerfield.com"}],"dist":{"integrity":"sha512-pWRXde9+0Manfg3DR/ycVNbK9YYMs2fDr9BBfYSLXJa9U1cc2NHFzogdqQwek5TTrsDRrmBQ85WIptX178a3zQ==","shasum":"cae7ff36a6eaad4f5bc932bfe8b6aba018aa3f95","tarball":"https://registry.npmjs.org/vue-fela/-/vue-fela-3.1.0.tgz","fileCount":8,"unpackedSize":24979,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIGwkIcT2kMKssr8T8md3Rpa0XlGocoNJHRPJUtj713p/AiEAtSUfQzv0E9ntW4YEo+jn0sigBcihY8r+aYFAsNS2hR0="}]},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/vue-fela_3.1.0_1522168540224_0.4711163370544542"},"_hasShrinkwrap":false},"3.1.1":{"name":"vue-fela","version":"3.1.1","description":"Vue Fela Plugin","homepage":"https://github.com/wagerfield/vue-fela#readme","author":{"name":"Matthew Wagerfield","email":"matthew@wagerfield.com"},"license":"MIT","keywords":["vue","fela","plugin"],"files":["index.js","lib"],"main":"index.js","jest":{"mapCoverage":true,"moduleFileExtensions":["js","vue"],"snapshotSerializers":["jest-serializer-vue"],"transform":{"^.+\\.js$":"babel-jest","^.+\\.vue$":"vue-jest"}},"scripts":{"lint":"eslint .","test":"jest --coverage && cat ./coverage/lcov.info | coveralls","test-watch":"jest --watch","test-coverage":"jest --coverage","precommit":"npm run lint && npm run test"},"repository":{"type":"git","url":"git+https://github.com/wagerfield/vue-fela.git"},"bugs":{"url":"https://github.com/wagerfield/vue-fela/issues"},"dependencies":{"fast-loops":"^1.0.0","fela-dom":"^7.0.4","isarray":"^2.0.4","isobject":"^3.0.1"},"peerDependencies":{"fela":"^6.1.3"},"devDependencies":{"babel-core":"^6.26.0","babel-jest":"^22.1.0","babel-preset-env":"^1.6.1","coveralls":"^3.0.0","eslint":"^4.16.0","eslint-config-supermind":"^0.48.0","fela":"^6.1.3","husky":"^0.14.3","jest":"^22.1.4","jest-serializer-vue":"^0.3.0","vue":"^2.5.13","vue-jest":"^1.4.0","vue-server-renderer":"^2.5.13","vue-template-compiler":"^2.5.13","vue-test-utils":"^1.0.0-beta.11"},"gitHead":"0f28545da79fa8f7a2463f519accee7b4f966621","_id":"vue-fela@3.1.1","_npmVersion":"5.6.0","_nodeVersion":"9.4.0","_npmUser":{"name":"wagerfield","email":"matthew@wagerfield.com"},"maintainers":[{"name":"dustin-h","email":"dustin.hoffner@gmail.com"},{"name":"wagerfield","email":"matthew@wagerfield.com"}],"dist":{"integrity":"sha512-ehrcW3aFm4XrhqygLkMkbgRHfa3CwAkWadl/jjNiqTu7k4fJd+ZpQRSsGI82/Mq8hUTVNzJwjlKk+aRA2gWVTw==","shasum":"3f59dd60a04f6c11e7c6d1eb4ebaab1508cfa127","tarball":"https://registry.npmjs.org/vue-fela/-/vue-fela-3.1.1.tgz","fileCount":8,"unpackedSize":24986,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCg3t/PJjfZt4Nak9vU871hiIuPpw4b9l4dvSh63hBzrQIhANVSdAWc4g/0DUJOsiEZDQ9mCtevZUFIm2PAlCnytHQz"}]},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/vue-fela_3.1.1_1522169842879_0.2741033538875537"},"_hasShrinkwrap":false},"3.2.0":{"name":"vue-fela","version":"3.2.0","description":"Vue Fela Plugin","homepage":"https://github.com/wagerfield/vue-fela#readme","author":{"name":"Matthew Wagerfield","email":"matthew@wagerfield.com"},"license":"MIT","keywords":["vue","fela","plugin"],"files":["index.js","lib"],"main":"index.js","jest":{"mapCoverage":true,"moduleFileExtensions":["js","vue"],"snapshotSerializers":["jest-serializer-vue"],"transform":{"^.+\\.js$":"babel-jest","^.+\\.vue$":"vue-jest"}},"scripts":{"lint":"eslint .","test":"jest --coverage && cat ./coverage/lcov.info | coveralls","test-watch":"jest --watch","test-coverage":"jest --coverage","precommit":"npm run lint && npm run test"},"repository":{"type":"git","url":"git+https://github.com/wagerfield/vue-fela.git"},"bugs":{"url":"https://github.com/wagerfield/vue-fela/issues"},"dependencies":{"fast-loops":"^1.0.0","fela-dom":"^7.0.4","isarray":"^2.0.4","isobject":"^3.0.1"},"peerDependencies":{"fela":"^6.1.3"},"devDependencies":{"babel-core":"^6.26.0","babel-jest":"^22.1.0","babel-preset-env":"^1.6.1","coveralls":"^3.0.0","eslint":"^4.16.0","eslint-config-supermind":"^0.48.0","fela":"^6.1.3","husky":"^0.14.3","jest":"^22.1.4","jest-serializer-vue":"^0.3.0","vue":"^2.5.13","vue-jest":"^1.4.0","vue-server-renderer":"^2.5.13","vue-template-compiler":"^2.5.13","vue-test-utils":"^1.0.0-beta.11"},"gitHead":"d879b2cf54c57ec586586f0cb8adbac24d465d61","_id":"vue-fela@3.2.0","_npmVersion":"5.6.0","_nodeVersion":"9.4.0","_npmUser":{"name":"wagerfield","email":"matthew@wagerfield.com"},"maintainers":[{"name":"dustin-h","email":"dustin.hoffner@gmail.com"},{"name":"wagerfield","email":"matthew@wagerfield.com"}],"dist":{"integrity":"sha512-maq60tcznstQlNu/fOLZMFCYHtMpMvaVwhqjsQdaCb3DgBQaOSrpkud2f6TznMTExIAPpFmVx3jwt4kWCmYyfw==","shasum":"f15a0f1014bc75a7926d769401f0e327bc817bd5","tarball":"https://registry.npmjs.org/vue-fela/-/vue-fela-3.2.0.tgz","fileCount":8,"unpackedSize":24998,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDo1eKyI6h1RxYRJ/GDA0pcG5YJze+dSX0Y6kEwBAOwkQIgEy8EdqmlhDdrhpoO7Bho/J7L/vXQQLSgVBJQM3ARMM4="}]},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/vue-fela_3.2.0_1522966877865_0.43797700783865956"},"_hasShrinkwrap":false},"3.3.0":{"name":"vue-fela","version":"3.3.0","description":"Vue Fela Plugin","homepage":"https://github.com/wagerfield/vue-fela#readme","author":{"name":"Matthew Wagerfield","email":"matthew@wagerfield.com"},"license":"MIT","keywords":["vue","fela","plugin"],"files":["index.js","lib"],"main":"index.js","jest":{"mapCoverage":true,"moduleFileExtensions":["js","vue"],"snapshotSerializers":["jest-serializer-vue"],"transform":{"^.+\\.js$":"babel-jest","^.+\\.vue$":"vue-jest"}},"scripts":{"lint":"eslint .","test":"jest --coverage && cat ./coverage/lcov.info | coveralls","test-watch":"jest --watch","test-coverage":"jest --coverage","precommit":"npm run lint && npm run test"},"repository":{"type":"git","url":"git+https://github.com/wagerfield/vue-fela.git"},"bugs":{"url":"https://github.com/wagerfield/vue-fela/issues"},"dependencies":{"fast-loops":"^1.0.0","fela-dom":"^7.0.4","isarray":"^2.0.4","isobject":"^3.0.1"},"peerDependencies":{"fela":"^6.1.3"},"devDependencies":{"babel-core":"^6.26.0","babel-jest":"^22.1.0","babel-preset-env":"^1.6.1","coveralls":"^3.0.0","eslint":"^4.16.0","eslint-config-supermind":"^0.48.0","fela":"^6.1.3","husky":"^0.14.3","jest":"^22.1.4","jest-serializer-vue":"^0.3.0","vue":"^2.5.13","vue-jest":"^1.4.0","vue-server-renderer":"^2.5.13","vue-template-compiler":"^2.5.13","vue-test-utils":"^1.0.0-beta.11"},"gitHead":"b6e2b5d0e5920c0395b498b388ba186e9762f1ce","_id":"vue-fela@3.3.0","_npmVersion":"5.6.0","_nodeVersion":"9.4.0","_npmUser":{"name":"wagerfield","email":"matthew@wagerfield.com"},"maintainers":[{"name":"dustin-h","email":"dustin.hoffner@gmail.com"},{"name":"wagerfield","email":"matthew@wagerfield.com"}],"dist":{"integrity":"sha512-sTQGPEskU2/Q528ygvn0DQjefwt/j0O6Ml/MENPe+jWAjcz8CukayPk97xgecwvEtrtJZ9+zLy8KCuf/dRK9Cg==","shasum":"ddb382a782ee64f82633879b7e2807b2370a8ce9","tarball":"https://registry.npmjs.org/vue-fela/-/vue-fela-3.3.0.tgz","fileCount":8,"unpackedSize":24802,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDpd40adm3R49DiczPzgDN+bfJTxxI+/+cPS5DDu5On0wIgD+PgGFeV35QB2qIAWR6wyre+qXb7T0zWRCWo23JjIMg="}]},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/vue-fela_3.3.0_1522968859590_0.22394782107222255"},"_hasShrinkwrap":false},"3.4.0":{"name":"vue-fela","version":"3.4.0","description":"Vue Fela Plugin","homepage":"https://github.com/wagerfield/vue-fela#readme","author":{"name":"Matthew Wagerfield","email":"matthew@wagerfield.com"},"license":"MIT","keywords":["vue","fela","plugin"],"files":["index.js","lib"],"main":"index.js","jest":{"mapCoverage":true,"moduleFileExtensions":["js","vue"],"snapshotSerializers":["jest-serializer-vue"],"transform":{"^.+\\.js$":"babel-jest","^.+\\.vue$":"vue-jest"}},"scripts":{"lint":"eslint .","test":"jest --coverage && cat ./coverage/lcov.info | coveralls","test-watch":"jest --watch","test-coverage":"jest --coverage","precommit":"npm run lint && npm run test"},"repository":{"type":"git","url":"git+https://github.com/wagerfield/vue-fela.git"},"bugs":{"url":"https://github.com/wagerfield/vue-fela/issues"},"dependencies":{"fast-loops":"^1.0.0","fela-dom":"^7.0.4","isarray":"^2.0.4","isobject":"^3.0.1"},"peerDependencies":{"fela":"^6.1.3"},"devDependencies":{"babel-core":"^6.26.0","babel-jest":"^22.1.0","babel-preset-env":"^1.6.1","coveralls":"^3.0.0","eslint":"^4.16.0","eslint-config-supermind":"^0.48.0","fela":"^6.1.3","husky":"^0.14.3","jest":"^22.1.4","jest-serializer-vue":"^0.3.0","vue":"^2.5.13","vue-jest":"^1.4.0","vue-server-renderer":"^2.5.13","vue-template-compiler":"^2.5.13","vue-test-utils":"^1.0.0-beta.11"},"gitHead":"e79cc4e5eadadfca6ccbca0961257bd2770c5ec8","_id":"vue-fela@3.4.0","_npmVersion":"5.6.0","_nodeVersion":"9.4.0","_npmUser":{"name":"wagerfield","email":"matthew@wagerfield.com"},"maintainers":[{"name":"dustin-h","email":"dustin.hoffner@gmail.com"},{"name":"wagerfield","email":"matthew@wagerfield.com"}],"dist":{"integrity":"sha512-o3SnEGteKe39UZQ0epXI2to1VoHWKppTEovEvDyaLhgXImEwOsv1i2hDgD1a6Pv51xpzFeK0HgJV6MaOg1/S/w==","shasum":"4213acaf1737d4a7d18e1787f73fbfcf9818d776","tarball":"https://registry.npmjs.org/vue-fela/-/vue-fela-3.4.0.tgz","fileCount":8,"unpackedSize":24449,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCICVt+3oCstWAmtGLoEwQzHfo8k1mEo9yX7MgO8QXrVclAiBDN+1QAhVUZk1RNep0CRWtCVx/+UMG9tnM+kEqP2/wJQ=="}]},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/vue-fela_3.4.0_1522999321713_0.012309808105007924"},"_hasShrinkwrap":false}},"readme":"# [Fela][fela] plugin for [Vue][vue]\n\n![build](https://img.shields.io/travis/wagerfield/vue-fela.svg)\n![coveralls](https://img.shields.io/coveralls/github/wagerfield/vue-fela.svg)\n![issues](https://img.shields.io/github/issues/wagerfield/vue-fela.svg)\n![license](https://img.shields.io/github/license/wagerfield/vue-fela.svg)\n\n- [Installation](#installation)\n- [Usage](#usage)\n - [Rendering Rules](#rendering-rules)\n - [mapRule(rule, optProps)](#map-rule)\n - [mapRules(rules, optMap, optProps)](#map-rules)\n - [mapStyles(rules, optMap, optProps)](#map-styles)\n - [renderRule(renderer, rule, props)](#render-rule)\n - [renderRules(renderer, rules, props, optMap)](#render-rules)\n - [Rendering Styles](#rendering-styles)\n - [Plugin Options](#plugin-options)\n - [Universal Rendering](#universal-rendering)\n - [Nuxt Example](#nuxt-example)\n- [Tests](#tests)\n\n## Installation\n\n```bash\nyarn add vue-fela\n```\n\n## Usage\n\n```js\nimport Vue from 'vue'\nimport VueFela from 'vue-fela'\nimport { createRenderer } from 'fela'\n\n// 1. Create a Fela renderer\nconst renderer = createRenderer()\n\n// 2. Install the plugin and pass the renderer as an option\nVue.use(VueFela, { renderer })\n```\n\nWhen the plugin is installed, a `$fela` property is set on Vue's `prototype` making it available on each component instance. The `$fela` property provides a reference to the [Fela Renderer][fela-renderer] instance that was passed as an option when the plugin was installed.\n\nThe Fela Renderer instance is also [provided][vue-provide-inject] through the `inject` interface on a `fela` key. This allows you to access the renderer within [functional Vue components][vue-functional].\n\n**Check out a full working [example using Nuxt](example).**\n\n## Rendering Rules\n\nSince a [Fela Renderer][fela-renderer] instance is assigned to Vue's `prototype`, you can reference and use within a Vue component via `this.$fela`.\n\nSee the [Single File Component][vue-sfc] example below:\n\n```html\n\n\n\n```\n\nIn the example above, we are passing `this` as the rule's `props` to Fela's `renderRule` function. Doing so will give the rule access to all the component instance properties such as `color` to derive the styles.\n\nYou can of course pass any arbitrary `props` object as the second argument to `renderRule`.\n\n\n\n### mapRule(rule, optProps)\n\nTo save having to define a computed prop function and return `this.$fela.renderRule(rule, props)` each time, a `mapRule` helper is provided:\n\n```html\n\n\n\n```\n\nPassing `optProps` as the second argument to `mapRule` is _optional_.\n\nIf `optProps` is omitted (like in the example above) then the Vue component instance will be passed by default. Typically this is the desired behaviour since a component's styles will generally want to be the result of its state.\n\nIn the example above, the `color` prop can be configured by a parent component. This value will then be available within the component instance via `this.color`. If `color` is not set by the parent component, it will default to 'red' since we have set the `default` field in the `props` color definition.\n\nAs you might expect, _all properties and methods_ on a Vue component instance can be used within a rule:\n\n- `props` values set by parent components\n- `data` values set when the component is initialised\n- `computed` values derived from other properties and state\n- `methods` that return values\n\nSince the class names being returned from `mapRule` are assigned to the component's `computed` props object, any change in state referenced by a rule will trigger an update and return new class names.\n\n\n\n### mapRules(rules, optMap, optProps)\n\nTaking it one step further, the `mapRules` helper repeats the work of `mapRule`—but expects an object map of `rules` rather than a single `rule` function:\n\n```html\n\n\n\n```\n\nWriting all your rules in a component can start to get a little cumbersome, so you might want to consider breaking them out into a separate file:\n\n```js\n// component-rules.js\nexport default {\n container: ({ highlight, textAlign }) => ({\n backgroundColor: highlight ? '#DDF' : '#DDD',\n padding: 16,\n textAlign\n }),\n heading: ({ highlight }) => ({\n fontWeight: highlight ? 700 : 400,\n fontSize: 24\n }),\n body: ({ highlight }) => ({\n color: highlight ? '#08F' : '#888',\n fontSize: 16\n })\n}\n```\n\n...and then `import` them into your Vue component:\n\n```html\n\n\n\n```\n\nCalling `mapRules(rules, optMap, optProps)` with no `optMap` argument will result in all `rules` being returned and assigned to the component's `computed` props.\n\nIn the example above, this would assign `container`, `heading` and `body` to the component's `computed` props. These 3 props can then be used as class names on the 3 respective elements in the template.\n\nThis behaviour might not always be desirable, so `mapRules` provides another level of control with the `optMap` argument.\n\nIf you have used [Vuex's mapping helpers][vuex-helpers] the following interface should look familiar to you.\n\n#### optMap\n\nThe `optMap` argument can either be:\n\n1. An Array of Strings where:\n - String values are the names of the rules to include in the object that is returned\n - This allows you to filter out only the rules you require\n - It does not allow you to rename the rules\n2. An Object of key values where:\n - Keys are aliases to use as the computed prop names in the object that is returned\n - Values are the names of the rules in the object map\n - This allows you to both filter and rename rules\n\nFor example, using the same component and rules map from the example above:\n\n```html\n\n\n\n```\n\nIn the example above you can see that we have used the [object spread operator][object-spread] to merge multiple calls to `mapRules` onto the component's `computed` props object. We have also omitted the `body` rule from the `component-rules.js` map.\n\n#### optProps\n\nFinally, much like the `mapRule` helper, `optProps` can be passed as the _third argument_ to `mapRules`. Omitting `optProps` will result in the component instance being passed to each of the rules as the `props` argument by default.\n\n\n\n### mapStyles(rules, optMap, optProps)\n\nIf your component has properties that clash with your rule names when mapping them to the `computed` object—you have a couple of options:\n\n1. Pass an `optMap` argument to `mapRules` to alias your rule names to different ones eg. `iconClass: 'icon'`\n2. Use a naming convention for all your rules that separates them from your component `props` eg. `iconRule` or `iconClass`\n\nThe first option requires more code in your components. The second option compromises the precise naming of your rules. Neither options are ideal.\n\nAs a third option you can use the `mapStyles` helper.\n\nThis helper works in _exactly the same way_ as `mapRules`, but rather than returning an object map of computed prop functions, it returns a single computed function.\n\nThe computed function returned from the `mapStyles` helper will then return an object map of class names that are the result of rendering your `rules`.\n\nThis allows you to assign all your rules to a single `computed` property eg. `styles` and render the result of each rule within your template using dot syntax eg. `styles.icon`:\n\n```html\n\n\n\n```\n\nThe function signature of `mapStyles(rules, optMap, optProps)` is identical to `mapRules(rules, optMap, optProps)`.\n\n[Read the documentation](#optmap) on `optMap` and `optProps` above.\n\n\n\n### renderRule(renderer, rule, props)\n\nWhen creating [functional Vue components][vue-functional] you can `inject` the Fela Renderer instance via the `fela` key:\n\n```js\nexport default {\n functional: true,\n inject: [ 'fela' ],\n render(h, { data, children, injections }) {\n // Reference to Fela Renderer instance\n const renderer = injections.fela\n return h('span', data, children)\n }\n}\n```\n\nTo render a single Fela `rule` you can either use the Fela Renderer instance's `renderRule` method directly or you can use the `renderRule` helper provided by Vue Fela. They do exactly the same thing—this is just a matter of style:\n\n```js\nimport { renderRule } from 'vue-fela'\n\nconst rule = ({ size }) => ({ width: size, height: size })\n\nexport default {\n functional: true,\n inject: [ 'fela' ],\n props: { size: Number },\n render(h, { props, children, injections }) {\n const renderer = injections.fela\n // The following 2 lines return exactly the same value\n const class1 = renderRule(renderer, rule, props)\n const class2 = renderer.renderRule(rule, props)\n // class1 === class2\n return h('span', {\n class: [ class1, class2 ] // a b\n }, children)\n }\n}\n```\n\n\n\n### renderRules(renderer, rules, props, optMap)\n\nWhen using an object map of `rules` within a [functional Vue component][vue-functional] you can use the `renderRules` helper provided by Vue Fela:\n\n```js\nimport { renderRules } from 'vue-fela'\n\nconst rules = {\n container: ({ fillColor }) => ({\n backgroundColor: fillColor,\n padding: '8px'\n }),\n text: ({ textColor }) => ({\n color: textColor,\n fontSize: '16px'\n }),\n}\n\nexport default {\n functional: true,\n inject: [ 'fela' ],\n props: {\n fillColor: String,\n textColor: String\n },\n render(h, { props, children, injections }) {\n const renderer = injections.fela\n const styles = renderRules(renderer, rules, props)\n return h('div', {\n class: styles.container\n }, [\n h('span', {\n class: styles.text\n }, children)\n ])\n }\n}\n```\n\nYou can also optionally pass `optMap` as the final argument to the `renderRules` helper.\n\nThis works in exactly the same way as [documented above](#optmap) in the `mapRules` helper.\n\n## Rendering Styles\n\nTo render the styles cached by the Fela Renderer we need to use `fela-dom`.\n\nHowever, since Fela works on both the [client][fela-client] and the [server][fela-server], the method for rendering the cached styles differs between environments.\n\nTo simplify this, `VueFela` handles the logic of determining what to do in each environment automatically.\n\n### Plugin Options\n\nYou can disable automatic rendering via the plugin options when installing `VueFela`:\n\n```js\nimport Vue from 'vue'\nimport VueFela from 'vue-fela'\nimport { createRenderer } from 'fela'\nimport { render } from 'fela-dom'\n\nconst renderer = createRenderer()\n\nVue.use(VueFela, {\n renderer, // required\n autoRender: false\n})\n\n// Manually render the styles (client-side)\nrender(renderer)\n```\n\nOptions that can be configured when the plugin is installed are as follows:\n\nOption | Type | Default | Description\n----------|------|---------|------------\n`renderer` | `Object` | | [Fela Renderer][fela-renderer] instance. **Required**\n`autoRender` | `Boolean` | `true` | Enable/disable automatic rendering. When set to `false` the `ssr` and `metaKeyName` properties are ignored\n`ssr` | `Boolean` | `true` | Enable/disable SSR\n`metaKeyName` | `String` | `head` | Vue Meta `keyName` [option][vue-meta-options]
This is [configured to work with Nuxt][nuxt-meta] by default\n\nAn example using [Vue Meta's default values][vue-meta-options] while disabling SSR can be seen below:\n\n```js\nimport Vue from 'vue'\nimport VueFela from 'vue-fela'\nimport { createRenderer } from 'fela'\n\nVue.use(VueFela, {\n renderer: createRenderer(), // required\n metaKeyName: 'metaInfo',\n ssr: false\n})\n```\n\n### Universal Rendering\n\nThe easiest way to create universal Vue applications is with [Nuxt][nuxt]. Nuxt takes care of setting up the logic for rendering Vue components on the server and rehydrating them on the client.\n\nNuxt uses `vue-meta` to render and update tags in the `` of your pages. [Vue Meta][vue-meta] provides the mechanism Vue Fela needs for rendering the cached styles on the server and sending them to the client.\n\nBecause of this, the `vue-fela` plugin is configured to work with `vue-meta` using [Nuxt's configuration options][nuxt-meta] by default.\n\n### Nuxt Example\n\nTo setup Vue Fela with Nuxt you will need to create a file in the `plugins` directory:\n\n```js\n// plugins/fela.js\nimport Vue from 'vue'\nimport VueFela from 'vue-fela'\nimport { createRenderer } from 'fela'\n\n// 1. Create a Fela renderer\nconst renderer = createRenderer()\n\n// 2. Install the plugin and pass the renderer as an option\nVue.use(VueFela, { renderer })\n```\n\nThen add the plugin to Nuxt's configuration:\n\n```js\n// nuxt.config.js\nmodule.exports = {\n plugins: [\n 'plugins/fela'\n ]\n}\n```\n\n**Check out a full working [example using Nuxt](example).**\n\n## Tests\n\nTests are written using [`jest`][jest] and [`vue-test-utils`][vue-test-utils].\n\nTo run the tests after cloning the repository and installing its dependencies:\n\n```bash\nyarn test\n```\n\nTo run the tests in watch mode:\n\n```bash\nyarn test-watch\n```\n\nTo generate a coverage report:\n\n```bash\nyarn test-coverage\n```\n\n## Author\n\n[Matthew Wagerfield][twitter]\n\n## License\n\n[MIT][mit]\n\n[vue]: https://vuejs.org\n[vue-sfc]: https://vuejs.org/v2/guide/single-file-components.html\n[vue-functional]: https://vuejs.org/v2/guide/render-function.html#Functional-Components\n[vue-provide-inject]: https://vuejs.org/v2/api/#provide-inject\n[vue-before-create]: https://vuejs.org/v2/api/#beforeCreate\n\n[vue-test-utils]: https://vue-test-utils.vuejs.org\n\n[vue-meta]: https://github.com/declandewet/vue-meta\n[vue-meta-options]: https://github.com/declandewet/vue-meta#options\n\n[vuex-helpers]: https://vuex.vuejs.org/en/api.html#component-binding-helpers\n\n[fela]: http://fela.js.org\n[fela-client]: http://fela.js.org/docs/advanced/DOMRendering.html\n[fela-server]: http://fela.js.org/docs/advanced/ServerRendering.html\n[fela-renderer]: http://fela.js.org/docs/basics/Renderer.html\n\n[nuxt]:https://nuxtjs.org\n[nuxt-meta]:https://nuxtjs.org/guide/views#html-head\n\n[object-spread]: https://github.com/tc39/proposal-object-rest-spread\n\n[jest]: https://facebook.github.io/jest\n\n[mit]: https://opensource.org/licenses/MIT\n\n[twitter]: https://twitter.com/wagerfield\n","maintainers":[{"name":"dustin-h","email":"dustin.hoffner@gmail.com"},{"name":"wagerfield","email":"matthew@wagerfield.com"}],"time":{"modified":"2022-06-28T19:28:28.513Z","created":"2017-08-12T21:36:49.924Z","0.0.1":"2017-08-12T21:36:49.924Z","0.0.2":"2017-08-13T08:23:41.480Z","0.0.3":"2017-08-13T12:33:13.985Z","0.0.4":"2017-10-03T16:45:36.531Z","1.0.0":"2018-02-12T13:12:13.236Z","2.0.0":"2018-02-12T13:31:11.451Z","2.1.0":"2018-02-21T13:47:25.626Z","2.2.0":"2018-02-22T14:39:06.222Z","2.3.0":"2018-02-27T21:17:11.223Z","2.3.1":"2018-02-27T21:35:54.668Z","2.4.0":"2018-02-28T20:52:08.103Z","2.5.0":"2018-03-06T14:13:24.385Z","2.6.0":"2018-03-12T12:08:25.528Z","2.6.1":"2018-03-12T15:10:43.096Z","2.7.0":"2018-03-19T12:10:13.972Z","3.0.0":"2018-03-27T15:28:59.084Z","3.1.0":"2018-03-27T16:35:40.403Z","3.1.1":"2018-03-27T16:57:22.927Z","3.2.0":"2018-04-05T22:21:18.025Z","3.3.0":"2018-04-05T22:54:19.800Z","3.4.0":"2018-04-06T07:22:01.849Z"},"homepage":"https://github.com/wagerfield/vue-fela#readme","repository":{"type":"git","url":"git+https://github.com/wagerfield/vue-fela.git"},"author":{"name":"Matthew Wagerfield","email":"matthew@wagerfield.com"},"bugs":{"url":"https://github.com/wagerfield/vue-fela/issues"},"license":"MIT","readmeFilename":"readme.md","keywords":["vue","fela","plugin"]}