Quasar App Flow

CQuasar App Flow In order to better understand how a boot file works and what it does, you need to understand how your website/app boots: Quasar is initialized (components, directives, plugins, Quasar i18n, Quasar icon sets) Quasar Extras get imported (Roboto font – if used, icons, animations, …) Quasar CSS & your app’s global CSS are imported App.vue is loaded (not yet being used) Store is imported (if using Vuex Store in src/store) Router is imported (in src/router) Boot files are imported Router default export function executed Boot files get their default export function executed (if on Electron mode) Electron is imported and injected into Vue prototype (if on Cordova mode) Listening for “deviceready” event and only then continuing with following steps Instantiating Vue with root component and attaching to DOM

Vue notes

Single File Components single-file components with a .vue extension is build by tools such as Webpack or Browserify A single-file component consists of three parts: - <template> which contains the component’s markup in plain HTML - <script> which exports the component object constructor that consists of all the JS logic within that component - <style> which contains all the component styles CORE Virtual DOM Component-based UI Focus on the view library—separate concerns for routing, state management Official component library for building mobile apps

Web vue-cli Note

webpack-simple Webpack is a module bundler for Javascript applications, it starts at the entrypoint and then build a dependency graph of the whole application, pulling those dependencies into one or more bundles that can be included in application. It supports multiple different file types through loaders, loaders will take files that have no concept of modules (e.g. css) and process them in a way that allows them to participate