pablohpsilva

module.exports = merge(baseWebpackConfig, {
  // ...
  plugins: [
    // ...
    // Build my bundle app.js from node_modules with NO quasar code
    new webpack.optimize.CommonsChunkPlugin({
      name: 'vendor',
      async: true,
      minChunks: function (module, count) {
        // any required modules inside node_modules are extracted to vendor

pablohpsilva

module.exports = merge(baseWebpackConfig, {
  // ...
  plugins: [
    new webpack.optimize.UglifyJsPlugin({
      sourceMap: config.build.productionSourceMap,
      minimize: true,
      compress: {
        warnings: false, // warn about potentially dangerous optimizations/code
        sequences: true,  // join consecutive statemets with the “comma operator”
        properties: true,  // optimize property access: a["foo"] → a.foo

pablohpsilva

import getDynamicClasses from '#JS/dynamic-classes'

export default ({ children, fixed }) => {
  return (
    <div
      className={getDynamicClasses({
        'toolbar': true,
        'toolbar-fixed': fixed
      })}>
      { children }

pablohpsilva

import { flattenObj } from '#JS/flatten'

const dynamicClasses = (obj) => {
  if (obj && obj instanceof Object) {
    const flatten = flattenObj(obj)
    return Object.keys(flatten)
      .filter(el => flatten[el])
      .join(' ')
  }
  return ''

pablohpsilva

const flattenObj = (obj) => {
  if (!obj) {
    return {}
  }
  return Object.keys(obj).reduce((acc, curr) => {
    const objValue = obj[curr]
    const ret = (objValue && objValue instanceof Object)
      ? flattenObj(objValue)
      : { [curr]: objValue }
    return Object.assign(acc, ret)

pablohpsilva

<div
  className={{
    'toolbar': true,
    'toolbar-fixed': fixed
  }}>
  { children }
</div>

pablohpsilva

<template>
  <div
    class="{
      toolbar: true,
      toolbar-fixed: fixed,
    }">
  </div>
</template>

pablohpsilva

<template lang="html">
  <div class="md-autocomplete"
    @focus="onFocus"
    @blur="onBlur">
    <md-menu md-menu-trigger
      ref="menu">
      <span md-menu-trigger></span>
      <input class="md-input"
        ref="input"
        type="text"

pablohpsilva

<template>
  <input v-model="someVariable" />
  
  <!-- Is the same as: -->
  
  <input :value="someVariable" @input="onInputUpdateSomeVariable" />
  
</template>

pablohpsilva

import babel from 'rollup-plugin-babel';
import commonjs from 'rollup-plugin-commonjs';
import eslint from 'rollup-plugin-eslint';
import html from 'rollup-plugin-html';
import livereload from 'rollup-plugin-livereload';
import nodeResolve from 'rollup-plugin-node-resolve';
import path from 'path';
import serve from 'rollup-plugin-serve';
import stylus from 'rollup-plugin-stylus-css-modules';
import uglify from 'rollup-plugin-uglify';