Merge branch 'vue3-work' into dev

.github/ISSUE_TEMPLATE/bug-report--quasar-v1-.md

@@ -30,6 +30,7 @@ If applicable, add screenshots to help explain your problem.
 Quasar Version:
 @quasar/app Version:
 Quasar mode:
+<<<<<<< HEAD:.github/ISSUE_TEMPLATE/bug-report--quasar-v1-.md
 
   - [ ] SPA
   - [ ] SSR
@@ -48,6 +49,23 @@ Tested on:
   - [ ] Capacitor
   - [ ] BEX
 
+=======
+  [ ] SPA
+  [ ] SSR
+  [ ] PWA
+  [ ] Electron
+  [ ] Cordova
+  [ ] Capacitor
+  [ ] BEX
+Tested on:
+  [ ] SPA
+  [ ] SSR
+  [ ] PWA
+  [ ] Electron
+  [ ] Cordova
+  [ ] Capacitor
+  [ ] BEX
+>>>>>>> vue3-work:.github/ISSUE_TEMPLATE/bug_report.md
 OS:
 Node:
 NPM:

.github/ISSUE_TEMPLATE/bug-report--quasar-v2-.md

@@ -30,6 +30,7 @@ If applicable, add screenshots to help explain your problem.
 Quasar Version:
 @quasar/app Version:
 Quasar mode:
+<<<<<<< HEAD
   - [ ] SPA
   - [ ] SSR
   - [ ] PWA
@@ -47,6 +48,23 @@ Tested on:
   - [ ] Capacitor
   - [ ] BEX
 
+=======
+  [ ] SPA
+  [ ] SSR
+  [ ] PWA
+  [ ] Electron
+  [ ] Cordova
+  [ ] Capacitor
+  [ ] BEX
+Tested on:
+  [ ] SPA
+  [ ] SSR
+  [ ] PWA
+  [ ] Electron
+  [ ] Cordova
+  [ ] Capacitor
+  [ ] BEX
+>>>>>>> vue3-work
 OS:
 Node:
 NPM:

.github/ISSUE_TEMPLATE/feature-request--quasar-v1-.md

@@ -1,6 +1,16 @@
 ---
+<<<<<<< HEAD
 name: Feature request (Quasar v1)
 about: Suggest an idea for Quasar v1
+=======
+<<<<<<< HEAD:.github/ISSUE_TEMPLATE/feature-request--quasar-v2-.md
+name: Feature request (Quasar v2)
+about: Suggest an idea for Quasar v2
+=======
+name: Feature request (Quasar v1)
+about: Suggest an idea for Quasar v1
+>>>>>>> vue3-work:.github/ISSUE_TEMPLATE/feature-request--quasar-v1-.md
+>>>>>>> vue3-work
 title: ''
 labels: Qv1, feature request
 assignees: ''

.github/ISSUE_TEMPLATE/feature-request--quasar-v2-.md

@@ -1,8 +1,20 @@
 ---
+<<<<<<< HEAD
+<<<<<<< HEAD:.github/ISSUE_TEMPLATE/feature-request--quasar-v2-.md
 name: Feature request (Quasar v2)
 about: Suggest an idea for Quasar v2
+=======
+name: Feature request (Quasar v1)
+about: Suggest an idea for Quasar v1
+>>>>>>> vue3-work:.github/ISSUE_TEMPLATE/feature-request--quasar-v1-.md
 title: ''
-labels: feature request
+labels: Qv1, feature request
+=======
+name: Feature request (Quasar v2)
+about: Suggest an idea for Quasar v2
+title: ''
+labels: Qv2, feature request
+>>>>>>> vue3-work
 assignees: ''
 
 ---

.github/PULL_REQUEST_TEMPLATE.md

@@ -25,7 +25,7 @@ If yes, please describe the impact and migration path for existing applications:
 
 **The PR fulfills these requirements:**
 
-- [ ] It's submitted to the `dev` branch and _not_ the `master` branch
+- [ ] It's submitted to the `dev` branch (or `v[X]` branch)
 - [ ] When resolving a specific issue, it's referenced in the PR's title (e.g. `fix: #xxx[,#xxx]`, where "xxx" is the issue number)
 - [ ] It's been tested on a Cordova (iOS, Android) app
 - [ ] It's been tested on a Electron app

CONTRIBUTING.md

@@ -50,7 +50,7 @@ Hi! I’m really excited that you are interested in contributing to Quasar. Befo
 
 ## Development Setup
 
-You will need [Node.js](http://nodejs.org) **version 8.9+** along [Yarn](https://yarnpkg.com/) or [NPM](https://docs.npmjs.com/getting-started/installing-node). Read `package.json` and take notice of the scripts you can use.
+You will need [Node.js](http://nodejs.org) **version 12.22.1+** along [Yarn](https://yarnpkg.com/) or [NPM](https://docs.npmjs.com/getting-started/installing-node). Read `package.json` and take notice of the scripts you can use.
 
 After cloning the repo, in each subfolder run:
 

README.md

@@ -4,7 +4,7 @@
 
 > Build high-performance VueJS user interfaces in record time: responsive Single Page Apps, SSR Apps, PWAs, Browser extensions, Hybrid Mobile Apps and Electron Apps. If you want, all using the same codebase!
 
-<img src="https://img.shields.io/npm/v/quasar.svg?label=quasar"> <img src="https://img.shields.io/npm/v/%40quasar/app.svg?label=@quasar/app"> <img src="https://img.shields.io/npm/v/%40quasar/cli.svg?label=@quasar/cli"> <img src="https://img.shields.io/npm/v/%40quasar/extras.svg?label=@quasar/extras"> <img src="https://img.shields.io/npm/v/%40quasar/icongenie.svg?label=@quasar/icongenie">
+<img src="https://img.shields.io/npm/v/quasar/next?label=quasar"> <img src="https://img.shields.io/npm/v/%40quasar/app/next?label=@quasar/app"> <img src="https://img.shields.io/npm/v/%40quasar/cli?label=@quasar/cli"> <img src="https://img.shields.io/npm/v/%40quasar/extras.svg?label=@quasar/extras"> <img src="https://img.shields.io/npm/v/%40quasar/icongenie.svg?label=@quasar/icongenie">
 
 [![Join the chat at https://chat.quasar.dev](https://img.shields.io/badge/chat-on%20discord-7289da.svg)](https://chat.quasar.dev)
 <a href="https://forum.quasar.dev" target="_blank"><img src="https://img.shields.io/badge/community-forum-brightgreen.svg"></a>

ROADMAP.md

@@ -0,0 +1,58 @@
+## Quasar Framework Roadmap
+
+Where will Quasar be in one year, five years or ten years? It's up to you, the developers using Quasar.
+
+You, the community, are Quasar. We listen to your opinions and your needs. Which is why we encourage you to directly contact us on [Discord](https://chat.quasar.dev) or submit [Feature Requests](https://github.com/quasarframework/quasar/issues/new/choose). We carefully ponder on all the ideas and we decide along with the community what are the next steps to be taken.
+
+### Important!
+
+If you want to speed up the development of Quasar please consider donating to the project. With proper funding, it allows more of the team to work on the project in a much more dedicated manner.
+
+[Donations - https://donate.quasar.dev](https://donate.quasar.dev)
+
+If you're in a company and using Quasar for commercial projects, explain to your management the importance of monthly donations (eg. $200+) for open source projects: you're the one using it every day and this makes you the best suited person to convince them. Be creative! :)
+
+Quasar is saving your company tens of thousands of development hours (quite literally), which in turn is a pretty high money savings. Consider giving back a part of those savings to refuel the project itself ;)
+
+## Support policy and schedule
+
+All major releases are typically supported for at least 12 months.
+LTS support ends 12 months after the release of a new major version.
+
+| Version | Status | Released   | Active support ends | LTS support ends |
+| ------- | ------ | ---------- | ------------------- | ---------------- |
+| 2.x     | Beta   | n/a        | After 01/04/2022    | After 01/04/2023 |
+| 1.x     | Active | 07/03/2019 | 01/04/2021          | 01/04/2022       |
+
+Quasar v0.x versions are no longer supported.
+
+## Major milestones
+
+We are updating this section constantly in order to keep you up to date with our current (and new!) efforts.
+
+*The schedule may change based only on unforeseen and/or out of the ordinary circumstances.*
+
+### Q2 2021
+* Vite.js plugin for Quasar v2.
+* ✌️ (DONE) Upgrade the App CLI for Quasar v2 to Webpack v5 ([reference](https://github.com/quasarframework/quasar/issues/8102))
+* Quasar v2 will become officially the "latest" version of Quasar. The documentation website (https://quasar.dev) will point to v2 and the v1 docs will live under https://v1.quasar.dev. The end of life for Quasar v1 will be March 2022 and we will keep on backporting fixes and new features from v2 to it until then.
+* Migration to Qv2 of most used testing AEs (`@quasar/testing`, `@quasar/testing-unit-jest`, `@quasar/testing-e2e-cypress`)
+* Typescript projects created with Quasar CLI (for Quasar v2) will have all files spawned in .ts format instead of .js for all Quasar modes (currently there are Quasar modes that have only templates in .js form). ([reference](https://github.com/quasarframework/quasar/issues/8572))
+* New maintainers recruiting and mentoring
+
+
+### Q3 2021
+* First beta of a new CLI for Quasar based on Vite.js instead of Webpack (will have its own life along with the current Webpack-based CLI).
+* Creation of official Quasar Organizational chart
+* Allow to save starter kit options as JSON profiles ([reference](https://github.com/quasarframework/quasar/issues/5537))
+* Quasar.Conf 2021
+
+### Q4 2021
+* The stable release of the new CLI based on Vite.js.
+* Advanced layouts/pages scaffolding (this will be a paid service)
+
+### Q1 2022
+* Work starting on Quasar v3.
+
+### Q2 2022
+* April 1st 2022 marks the end of life for Quasar v1. It will no longer receive updates.

SECURITY.md

@@ -6,7 +6,7 @@
 | ------- | ------------------ |
 | 1.x.x   | :white_check_mark: |
 | 0.17.x  | :white_check_mark: |
-| <= 0.17 | :x:                |
+| < 0.17  | :x:                |
 
 ## Reporting a Vulnerability
 

app/README.md

@@ -4,7 +4,7 @@
 
 > Build high-performance VueJS user interfaces in record time: responsive Single Page Apps, SSR Apps, PWAs, Browser extensions, Hybrid Mobile Apps and Electron Apps. If you want, all using the same codebase!
 
-<img src="https://img.shields.io/npm/v/%40quasar/app.svg?label=@quasar/app">
+<img src="https://img.shields.io/npm/v/%40quasar/app/next?label=@quasar/app">
 
 [![Join the chat at https://chat.quasar.dev](https://img.shields.io/badge/chat-on%20discord-7289da.svg)](https://chat.quasar.dev)
 <a href="https://forum.quasar.dev" target="_blank"><img src="https://img.shields.io/badge/community-forum-brightgreen.svg"></a>

app/bin/quasar-build

@@ -94,36 +94,21 @@ ensureArgv(argv, 'build')
 const banner = require('../lib/helpers/banner')
 banner(argv, 'build')
 
-const { log, warn, fatal } = require('../lib/helpers/logger')
+const { log, fatal } = require('../lib/helpers/logger')
+const { printWebpackErrors } = require('../lib/helpers/print-webpack-issue')
+const { webpackNames, splitWebpackConfig } = require('../lib/webpack/symbols')
 
-const chalk = require('chalk')
 const path = require('path')
 const webpack = require('webpack')
 
-function splitConfig (webpackConf, mode) {
-  if (mode === 'ssr') {
-    return [
-      { webpack: webpackConf.server, name: 'Server' },
-      { webpack: webpackConf.client, name: 'Client' },
-      { webpack: webpackConf.webserver, name: 'Webserver' }
-    ]
-  }
+function parseWebpackConfig (cfg, mode) {
+  let data = splitWebpackConfig(cfg, mode)
 
-  if (['electron', 'bex'].includes(mode)) {
-    return [
-      { webpack: webpackConf.renderer, name: 'Renderer process' },
-      { webpack: webpackConf.main, name: 'Main process' }
-    ]
+  if (mode === 'pwa') {
+    // CSW needs to be compiled separately, before UI
+    data = data.filter(entry => entry.name !== webpackNames.pwa.csw)
   }
 
-  return [
-    { webpack: webpackConf, name: 'Build' }
-  ]
-}
-
-function parseWebpackConfig (cfg, mode) {
-  const data = splitConfig(cfg, mode)
-
   return {
     configs: data.map(d => d.webpack),
     name: data.map(d => d.name),
@@ -155,6 +140,12 @@ async function build () {
     await installMissing(argv.mode, argv.target)
   }
 
+  if (argv.mode === 'ssr') {
+    const SSRDirectives = require('../lib/ssr/ssr-directives')
+    const directivesBuilder = new SSRDirectives()
+    await directivesBuilder.build()
+  }
+
   const QuasarConfFile = require('../lib/quasar-conf-file')
   const Generator = require('../lib/generator')
   const artifacts = require('../lib/artifacts')
@@ -181,8 +172,8 @@ async function build () {
     await quasarConfFile.prepare()
   }
   catch (e) {
-    console.log(e)
-    fatal(`[FAIL] quasar.conf.js has JS errors`)
+    console.error(e)
+    fatal('quasar.conf.js has JS errors', 'FAIL')
   }
 
   await quasarConfFile.compile()
@@ -193,8 +184,7 @@ async function build () {
 
   regenerateTypesFeatureFlags(quasarConf)
 
-  let outputFolder = quasarConf.build.packagedDistDir ||
-  quasarConf.build.distDir
+  let outputFolder = quasarConf.build.packagedDistDir || quasarConf.build.distDir
 
   artifacts.clean(outputFolder)
   generator.build()
@@ -209,7 +199,15 @@ async function build () {
     await hook.fn(hook.api, { quasarConf })
   })
 
-  log(`Compiling with Webpack...`)
+  // using quasarConfFile.ctx instead of argv.mode
+  // because SSR might also have PWA enabled but we
+  // can only know it after parsing the quasar.conf file
+  if (quasarConfFile.ctx.mode.pwa === true) {
+    // need to build the custom service worker before renderer
+    Runner = require('../lib/pwa')
+    Runner.init(ctx)
+    await Runner.build(quasarConfFile, argv)
+  }
 
   let webpackData = parseWebpackConfig(webpackConf, argv.mode)
 
@@ -226,28 +224,16 @@ async function build () {
 
     artifacts.add(outputFolder)
 
-    const statsArray = stats.stats || [ stats ]
+    const statsArray = stats.stats
 
-    statsArray.forEach(stat => {
-      if (stat.hasErrors() !== true) {
+    statsArray.forEach((stats, index) => {
+      if (stats.hasErrors() !== true) {
         return
       }
 
-      const info = stat.toJson()
-      const errNumber = info.errors.length
-      const errDetails = `${errNumber} error${errNumber > 1 ? 's' : ''}`
-
-      warn()
-      warn(chalk.red(`${errDetails} encountered:\n`))
-
-      info.errors.forEach(err => {
-        console.error(err)
-      })
-
-      warn()
-      warn(chalk.red(`[FAIL] Build failed with ${errDetails}. Check log above.\n`))
-
-      process.exit(1)
+      const summary = printWebpackErrors(webpackData.name[index], stats)
+      console.log()
+      fatal(`for "${webpackData.name[index]}" with ${summary}. Please check the log above.`, 'COMPILATION FAILED')
     })
 
     const printWebpackStats = require('../lib/helpers/print-webpack-stats')

app/bin/quasar-describe

@@ -241,36 +241,8 @@ function printSlots ({ slots }) {
   }
 
   for (let slot in slots) {
-    console.log('\n   ' + chalk.green(slot))
-    console.log('     ' + slots[slot].desc)
-  }
-}
-
-function printScopedSlots ({ scopedSlots }) {
-  const keys = Object.keys(scopedSlots || {})
-
-  console.log('\n ' + chalk.underline('Scoped Slots'))
-
-  if (keys.length === 0) {
-    console.log('\n   ' + chalk.italic('*No scoped slots*'))
-    return
-  }
-
-  if (argv.filter) {
-    keys.forEach(key => {
-      if (key.indexOf(argv.filter) === -1) {
-        delete scopedSlots[key]
-      }
-    })
-    if (Object.keys(scopedSlots).length === 0) {
-      console.log('\n   ' + chalk.italic('*No matching scoped slots*'))
-      return
-    }
-  }
-
-  for (let slot in scopedSlots) {
     console.log()
-    printProp(scopedSlots[slot], slot, 3)
+    printProp(slots[slot], slot, 3)
   }
 }
 
@@ -279,14 +251,8 @@ function printEvents ({ events, behavior = {} }) {
 
   console.log('\n ' + chalk.underline('Events'))
 
-  if (behavior.$listeners !== void 0) {
-    console.log(`\n   ${chalk.italic(behavior.$listeners.desc)}`)
-  }
-
   if (keys.length === 0) {
-    if (behavior.$listeners === void 0) {
-      console.log('\n   ' + chalk.italic('*No events*'))
-    }
+    console.log('\n   ' + chalk.italic('*No events*'))
     return
   }
 
@@ -462,7 +428,6 @@ function describe (api) {
       apiParts.quasar === true && printQuasarConfOptions(api)
       apiParts.props === true && printProperties(api)
       apiParts.slots === true && printSlots(api)
-      apiParts.slots === true && printScopedSlots(api)
       apiParts.events === true && printEvents(api)
       apiParts.methods === true && printMethods(api)
       break