From 256e8b8ad41c0c9d06d70f76f0c074556dff15b8 Mon Sep 17 00:00:00 2001 From: Razvan Stoenescu Date: Fri, 30 Aug 2019 11:24:05 +0300 Subject: [PATCH] feat(app): Allow forcing publicPath on dev mode too (for SPA and PWA only) #4962 --- app/lib/dev-server.js | 10 +++-- app/lib/quasar-config.js | 57 +++++++++++++++------------ app/lib/ssr/html-template.js | 4 +- app/lib/webpack/plugin.html-addons.js | 4 +- 4 files changed, 42 insertions(+), 33 deletions(-) diff --git a/app/lib/dev-server.js b/app/lib/dev-server.js index 1d09179f55e..266e4763618 100644 --- a/app/lib/dev-server.js +++ b/app/lib/dev-server.js @@ -236,8 +236,12 @@ module.exports = class DevServer { const serverCompilerWatcher = serverCompiler.watch({}, () => {}) + const originalAfter = cfg.devServer.after + // start building & launch server const server = new WebpackDevServer(clientCompiler, { + ...cfg.devServer, + after: app => { if (cfg.ctx.mode.pwa) { app.use('/manifest.json', (req, res) => { @@ -254,6 +258,8 @@ module.exports = class DevServer { maxAge: 0 })) + originalAfter && originalAfter(app) + SsrExtension.getModule().extendApp({ app, @@ -287,9 +293,7 @@ module.exports = class DevServer { }) app.get('*', render) - }, - - ...cfg.devServer + } }) readyPromise.then(() => { diff --git a/app/lib/quasar-config.js b/app/lib/quasar-config.js index 88393d39df7..716ba057a41 100644 --- a/app/lib/quasar-config.js +++ b/app/lib/quasar-config.js @@ -24,7 +24,7 @@ function encode (obj) { function formatPublicPath (path) { if (!path) { - return path + return path || '' } if (!path.endsWith('/')) { @@ -477,14 +477,10 @@ class QuasarConfig { cfg.build.publicPath = (this.ctx.prod || cfg.build.forceDevPublicPath) && cfg.build.publicPath && ['spa', 'pwa'].includes(this.ctx.modeName) ? formatPublicPath(cfg.build.publicPath) - : (cfg.build.vueRouterMode !== 'hash' ? '/' : '') + : (cfg.build.vueRouterMode === 'hash' ? '' : '/') cfg.build.vueRouterBase = formatRouterBase(cfg.build.publicPath) - cfg.build.appBase = cfg.build.vueRouterMode === 'history' - ? cfg.build.publicPath - : '' - cfg.sourceFiles = merge({ rootComponent: 'src/App.vue', router: 'src/router/index', @@ -539,6 +535,8 @@ class QuasarConfig { } if (this.ctx.dev) { + const originalBefore = cfg.devServer.before + cfg.devServer = merge({ publicPath: cfg.build.publicPath, hot: true, @@ -551,13 +549,27 @@ class QuasarConfig { compress: true, open: true }, cfg.devServer, { - contentBase: [ appPaths.srcDir ] + contentBase: false, + + before: app => { + if (!this.ctx.mode.ssr) { + const express = require('express') + + app.use((cfg.build.publicPath || '/') + 'statics', express.static(appPaths.resolve.src('statics'), { + maxAge: 0 + })) + + if (this.ctx.mode.cordova) { + const folder = appPaths.resolve.cordova(`platforms/${this.ctx.targetName}/platform_www`) + app.use('/', express.static(folder, { maxAge: 0 })) + } + } + + originalBefore && originalBefore(app) + } }) - if (this.ctx.mode.ssr) { - cfg.devServer.contentBase = false - } - else if (this.ctx.mode.cordova || this.ctx.mode.electron) { + if (this.ctx.mode.cordova || this.ctx.mode.electron) { cfg.devServer.open = false if (this.ctx.mode.electron) { @@ -565,12 +577,6 @@ class QuasarConfig { } } - if (this.ctx.mode.cordova) { - cfg.devServer.contentBase.push( - appPaths.resolve.cordova(`platforms/${this.ctx.targetName}/platform_www`) - ) - } - if (cfg.devServer.open) { const isMinimalTerminal = require('./helpers/is-minimal-terminal') if (isMinimalTerminal) { @@ -682,8 +688,12 @@ class QuasarConfig { const host = cfg.devServer.host === '0.0.0.0' ? 'localhost' : cfg.devServer.host - const urlPath = `${cfg.build.vueRouterMode === 'hash' ? (cfg.build.htmlFilename !== 'index.html' ? cfg.build.htmlFilename : '') : ''}` - cfg.build.APP_URL = `http${cfg.devServer.https ? 's' : ''}://${host}:${cfg.devServer.port}/${urlPath}` + + const urlPath = cfg.build.vueRouterMode === 'hash' + ? (cfg.build.htmlFilename !== 'index.html' ? (cfg.build.publicPath ? '' : '/') + cfg.build.htmlFilename : '') + : '' + + cfg.build.APP_URL = `http${cfg.devServer.https ? 's' : ''}://${host}:${cfg.devServer.port}${cfg.build.publicPath}${urlPath}` } else if (this.ctx.mode.cordova) { cfg.build.APP_URL = 'index.html' @@ -706,13 +716,8 @@ class QuasarConfig { 'process.env': cfg.build.env } - if (this.ctx.mode.electron) { - if (this.ctx.dev) { - cfg.build.env.__statics = `"${appPaths.resolve.src('statics').replace(/\\/g, '\\\\')}"` - } - } - else { - cfg.build.env.__statics = `"${((this.ctx.prod || cfg.build.forceDevPublicPath) && cfg.build.publicPath) ? cfg.build.publicPath : '/' }statics"` + if (this.ctx.mode.electron && this.ctx.dev) { + cfg.build.env.__statics = `"${appPaths.resolve.src('statics').replace(/\\/g, '\\\\')}"` } appFilesValidations(cfg) diff --git a/app/lib/ssr/html-template.js b/app/lib/ssr/html-template.js index b9300acef6c..faa7d3fb667 100644 --- a/app/lib/ssr/html-template.js +++ b/app/lib/ssr/html-template.js @@ -69,8 +69,8 @@ module.exports.getIndexHtml = function (template, cfg) { html = injectSsrInterpolation(html) - if (cfg.build.appBase) { - html = fillBaseTag(html, cfg.build.appBase) + if (cfg.build.publicPath) { + html = fillBaseTag(html, cfg.build.publicPath) } if (cfg.build.minify) { diff --git a/app/lib/webpack/plugin.html-addons.js b/app/lib/webpack/plugin.html-addons.js index a4d79a41a76..2ef55201a08 100644 --- a/app/lib/webpack/plugin.html-addons.js +++ b/app/lib/webpack/plugin.html-addons.js @@ -30,9 +30,9 @@ module.exports.plugin = class HtmlAddonsPlugin { apply (compiler) { compiler.hooks.compilation.tap('webpack-plugin-html-addons', compilation => { - if (this.cfg.build.appBase) { + if (this.cfg.build.publicPath) { compilation.hooks.htmlWebpackPluginBeforeHtmlProcessing.tapAsync('webpack-plugin-html-base-tag', (data, callback) => { - data.html = fillBaseTag(data.html, this.cfg.build.appBase) + data.html = fillBaseTag(data.html, this.cfg.build.publicPath) callback(null, data) }) }