SOLVED "quasar init" appears to work, "quasar dev" subsequently results in a blank page but "quasar build" works as expected (macOS, details inside, tia)

[pete]

Hello,

We have been using Quasar for a few days and today resolved to ensure we are using the latest packages.

The difficulty that has arisen is that, beginning with an updated macOS High Sierra install on a macbook pro, and what we assume to be the latest packages, we end up with a project where running quasar build results in expected behavior (a dist/ directory where we can run python -m SimpleHTTPServer and subsequently see things work locally), while running quasar dev or quasar dev --mode electron in contrast, always appears to compile fine and start the development web server or launch electron app, only to effectively serve a blank page with no error in the console or the window wherein we ran quasar dev:

λ ./osxinfo
…
Model : MacBookPro11,5
Processor : Intel Core i7-4870HQ CPU @ 2.50GHz
OS : Darwin
Release : 17.7.0
Disk : 3.21% of 958.81 GB
Memory : 13440 MB of 17180 MB
Shell : /bin/bash
Terminal : screen
Memory : 13440 MB of 17180 MB
Graphics : AMD Radeon R9 M370X @ 2048 MB
Graphics : Intel Iris Pro @ 1536 MB
Packages : no packages found
Uptime : 1 day 06:41

λ vue --version
3.0.3

λ quasar init we-are-testing-create-project
Running command: vue init ‘quasarframework/quasar-starter-kit’ we-are-testing-create-project

? Project name (internal usage for dev) we-are-testing-create-project
? Project product name (official name) Quasar App
? Project description A Quasar Framework app
? Author Pete Thomas pete@xminusone.net
? Check the features needed for your project: ESLint
? Pick an ESLint preset Standard
? Cordova id (disregard if not building mobile apps) org.cordova.quasar.app
? Should we run npm install for you after the project has been created? (recommended)
Yes, use Yarn (recommended)
❯ Yes, use NPM
…
vue-cli · Generated “we-are-testing-create-project”.
…
[] Installing project dependencies …
…
npm WARN deprecated @babel/preset-stage-2@7.0.0-beta.54: � We’ve deprecated any official stage presets in favor of users explicitly opt-ing into the proposals they want to use versus any perceived convenience. You can also check https://github.com/babel/babel/issues/7770 for more information.
npm WARN deprecated @babel/preset-stage-3@7.0.0-beta.54: � We’ve deprecated any official stage presets in favor of users explicitly opt-ing into the proposals they want to use versus any perceived convenience. You can also check https://github.com/babel/babel/issues/7770 for more information.
…
[fsevents] Success: “/Users/c2fo/projects/osxinfo/we-are-testing-create-project/node_modules/fsevents/lib/binding/Release/node-v64-darwin-x64/fse.node” already installed
Pass --update-binary to reinstall or --build-from-source to recompile
npm notice created a lockfile as package-lock.json. You should commit this file.
added 1412 packages from 607 contributors and audited 15939 packages in 23.935s
found 0 vulnerabilities
…
[] Running eslint --fix to comply with chosen preset rules…

we-are-testing-create-project@1.0.0 lint /Users/c2fo/projects/osxinfo/we-are-testing-create-project
eslint --ext .js,.vue src “–fix”

[*] Quasar Project initialization finished!

To get started:

cd we-are-testing-create-project
quasar dev

Documentation can be found at: https://quasar-framework.org

Quasar is relying on donations to evolve. We’d be very grateful if you can
take a look at: https://www.patreon.com/quasarframework
Any amount is very welcomed.
If invoices are required, please first contact razvan.stoenescu@gmail.com

Please give us a star on Github if you appreciate our work:
https://github.com/quasarframework/quasar

Enjoy! - Quasar Team

…

λ quasar dev

Dev mode… spa
Quasar theme… mat
Quasar CLI… v0.17.19
Quasar Framework… v0.17.16
Debugging… enabled

app:quasar-conf Reading quasar.conf.js +0ms
app:dev Checking listening address availability (0.0.0.0:8080)… +4ms
app:webpack Extending SPA Webpack config +287ms
app:generator Generating Webpack entry point +6ms
app:dev-server Booting up… +2ms

SPA ██████████ building modules [39%] 247/252 modules 5 active

…

N App URL… http://localhost:8080/
Dev mode… spa
Quasar theme… mat
Quasar CLI… v0.17.19
Quasar Framework… v0.17.16

↑ at this point, visiting Firefox in firefox 62.0.2 with a default about:config results in a blank page with nothing in the developer console and nothing in the terminal window managing quasar dev, while, repeating myself quasar build works OK.

Vue ff addon does not recognize the final result:

Any guidance greatly appreciated and thanks in advance.

-pete

[pete]

Adding results of quasar info:

λ quasar info

Operating System Darwin(17.7.0) - darwin/x64
NodeJs 10.11.0

Global packages
NPM 6.4.1
yarn Not installed
quasar-cli 0.17.19
vue-cli 3.0.3
cordova Not installed

Important local packages
quasar-cli 0.17.19 (Quasar Framework CLI)
quasar-framework 0.17.16 (Build responsive SPA, SSR, PWA, Hybrid Mobile Apps and Electron apps, all simultaneously using the same codebase)
quasar-extras 2.0.6 (Quasar Framework fonts, icons and animations)
vue 2.5.17 (Reactive, component-oriented view layer for modern web interfaces.)
vue-router 3.0.1 (Official router for Vue.js 2)
vuex 3.0.1 (state management for Vue.js)
electron Not installed
electron-packager Not installed
electron-builder Not installed
@babel/core 7.0.0-beta.54 (Babel compiler core.)
webpack 4.19.1 (Packs CommonJs/AMD modules for the browser. Allows to split your codebase into multiple bundles, which can be loaded on demand. Support loaders to preprocess files, i.e. json, jsx, es7, css, less, … and your custom stuff.)
webpack-dev-server 3.1.8 (Serves a webpack app. Updates the browser on changes.)
workbox-webpack-plugin 3.5.0 (A plugin for your Webpack build process, helping you generate a manifest of local files that workbox-sw should precache.)
register-service-worker 1.5.2 (Script for registering service worker, with hooks)

Networking
Host c2fos-MacBook-Pro.local
en0 xxx.xxx.xxx.xxx

[s.molinari]

Hi,

You said “at this point, visiting Firefox”. Did Firefox (or any browser) open up on its own? Was there any other message in the browser? Was any HTML sent to the browser at all?

Scott

[pete]

Scott, Thanks for the reply.

Safari behaves similar to Firefox. I get a blank page with no info. I believe no HTML is delivered, based on the view:

https://i.postimg.cc/2SVK5Bm6/firefox-dev-window.png

For Chrome, I downloaded it and it would not seem to connect to localhost so I unchecked Safe Browsing in advanced options, but still get this:

https://i.postimg.cc/tgmP4YqX/Screen_Shot_2018-09-24_at_6.55.42_AM.png

[pete]

Scott, thanks again. I think I had a very broken node install and have addressed this issue through a clean install process, so thought I would just note it here with the details:

• Uninstalled node via https://github.com/brock/node-reinstall // but stopped the script before it began to “reinstall”, it prompts at various stages and allows one to exit after a certain point

• Installed nvm and selected v10.11.0 so that I end up with:

λ node --version
v10.11.0
λ npm --version
6.4.1
λ vue --version
3.0.3
λ quasar --version
0.17.19
λ nvm --version
0.33.11

And now I just tested quasar init with defaults + npm, and quasar dev worked fine.

No more issue!