trainiac

afdaf

trainiac

import Vue from 'vue'
import { some } from 'utils/arr'

const harmlessMessages = [
  // Facebook throws error that doesn't matter to us
  'https://staticxx.facebook.com',
  // Chrome from autocomplete bug.
  '__gCrWeb.autofill.extractForms',
]

trainiac

/* eslint-disable no-magic-numbers */

// Add eslint-plugin-prettier once merged https://github.com/prettier/eslint-plugin-prettier/pull/70

module.exports = {
  extends: ['standard', 'prettier', 'plugin:vue/recommended'],
  plugins: ['compat'] /*, 'prettier' */,
  globals: {
    process: true,
  },

trainiac

module.exports = {
  extends: ['stylelint-config-recommended-scss', 'stylelint-config-prettier'],
  processors: ['stylelint-processor-html'],
  plugins: ['stylelint-no-unsupported-browser-features'],
  quiet: false,
  rules: {
    'no-invalid-double-slash-comments': null,
    'no-empty-source': null,
    'property-no-unknown': true,
    'color-no-invalid-hex': true,

trainiac

export default context => {
  const store = createStore()
  const router = createRouter()
  const app = createApp(store, router)
  
  return new Promise((resolve, reject) => {
    router.onReady(resolve, reject)
    router.push(context.url)
  }).then(() => {
    // onReady hook

trainiac

const store = createStore()

// data populated from server
store.replaceState(window.__INITIAL_STATE__)
const router = createRouter()

const routerReady = new Promise(resolve => {
  router.onReady(resolve)
}).then(() => {
  // onReady hook

trainiac

<script>
export default {
  name: 'MyRouteComponent',
  permissions(store, to, from) {
    // request permissions data
    // return a promise to resolve or reject navigation
  },
  criticalData(store, to, from) {
    // request critical data
    // return a promise so that data can finish loading during Server Request lifecycle

trainiac

/*
 When you want to add a component to the DOM and have it animate on mount 
 you have to give a little delay before changing the css to 
 trigger a css animation. Otherwise the css transition doesn't work.

 When you want to remove a component from the DOM and have it animate before
 being removed you have to wait until an animation is complete.
 
 This gives you two pieces of state to make that easy.
*/