diff --git a/docs/guide/configuration.md b/docs/guide/configuration.md index 20504de..1ff4e04 100644 --- a/docs/guide/configuration.md +++ b/docs/guide/configuration.md @@ -22,6 +22,8 @@ module.exports = { defaultTitle: 'My app', // Path to favicon favicon: './public/favicon.ico', + // Enable Critical CSS + criticalCSS: true, // Skip some requests from being server-side rendered skipRequests: req => req.originalUrl === '/graphql', // See https://ssr.vuejs.org/guide/build-config.html#externals-caveats diff --git a/lib/config.js b/lib/config.js index bcd263a..1295a61 100644 --- a/lib/config.js +++ b/lib/config.js @@ -9,6 +9,7 @@ module.exports = { entry: target => `./src/entry-${target}`, defaultTitle: 'My app', favicon: './public/favicon.ico', + criticalCSS: true, skipRequests: req => req.originalUrl === '/graphql', nodeExternalsWhitelist: [/\.css$/, /\?vue&type=style/], applyDefaultServer: true, diff --git a/lib/dev-server.js b/lib/dev-server.js index 4f5859f..02a1a81 100644 --- a/lib/dev-server.js +++ b/lib/dev-server.js @@ -70,9 +70,13 @@ module.exports.setupDevServer = ({ server, templatePath, onUpdate }) => new Prom jsonStats.warnings.forEach(err => console.warn(err)) } if (stats.hasErrors()) return + + // Fix dev server render error when a custom path is used for the server-renderer bundles + const ssrPlugin = (clientConfig.plugins.find((p) => (p.__pluginName || p.constructor.name) === 'ssr') || {}).options || {} + clientManifest = JSON.parse(readFile( devMiddleware.fileSystem, - 'vue-ssr-client-manifest.json' + (ssrPlugin && ssrPlugin.filename) || 'vue-ssr-client-manifest.json' )) // HTML Template @@ -109,8 +113,17 @@ module.exports.setupDevServer = ({ server, templatePath, onUpdate }) => new Prom jsonStats.warnings.forEach(err => console.warn(err)) } if (stats.hasErrors()) return + + // Try to find ssr plugin config options + // to fix dev server render error when a custom path is used for the server-renderer bundles + const ssrPlugin = (serverConfig.plugins.find((p) => (p.__pluginName || p.constructor.name) === 'ssr') || {}).options || {} + // read bundle generated by vue-ssr-webpack-plugin - serverBundle = JSON.parse(readFile(serverMfs, 'vue-ssr-server-bundle.json')) + serverBundle = JSON.parse(readFile( + serverMfs, + (ssrPlugin && ssrPlugin.filename) || 'vue-ssr-server-bundle.json' + )) + update() onCompilationCompleted() }) diff --git a/lib/webpack.js b/lib/webpack.js index 07e0cca..4aa4266 100644 --- a/lib/webpack.js +++ b/lib/webpack.js @@ -24,7 +24,7 @@ exports.chainWebpack = (webpackConfig) => { webpackConfig.plugins.delete('friendly-errors') const isExtracting = webpackConfig.plugins.has('extract-css') - if (isExtracting) { + if (isExtracting && config.criticalCSS) { // Remove extract const langs = ['css', 'postcss', 'scss', 'sass', 'less', 'stylus'] const types = ['vue-modules', 'vue', 'normal-modules', 'normal']