mirror of
https://github.com/nuxt/nuxt.git
synced 2024-11-11 08:33:53 +00:00
Bind render method to nuxt
This commit is contained in:
Sébastien Chopin
parent
1180b972a2
commit
3b89191998
93
lib/nuxt.js
93
lib/nuxt.js
@ -1,6 +1,5 @@
|
||||
'use strict'
|
||||
|
||||
const debug = require('debug')('nuxt:render')
|
||||
const _ = require('lodash')
|
||||
const co = require('co')
|
||||
const fs = require('fs-extra')
|
||||
@ -8,11 +7,11 @@ const pify = require('pify')
|
||||
const ansiHTML = require('ansi-html')
|
||||
const serialize = require('serialize-javascript')
|
||||
const build = require('./build')
|
||||
const render = require('./render')
|
||||
const generate = require('./generate')
|
||||
const serveStatic = require('serve-static')
|
||||
const { resolve, join } = require('path')
|
||||
const { urlJoin } = require('./utils')
|
||||
const { encodeHtml, getContext, setAnsiColors } = require('./utils')
|
||||
const { encodeHtml, setAnsiColors } = require('./utils')
|
||||
setAnsiColors(ansiHTML)
|
||||
|
||||
class Nuxt {
|
||||
@ -76,6 +75,9 @@ class Nuxt {
|
||||
this.serveStaticNuxt = pify(serveStatic(resolve(this.dir, '.nuxt', 'dist')))
|
||||
// Add this.build
|
||||
this.build = build.bind(this)
|
||||
// Add this.render and this.renderRoute
|
||||
this.render = render.render.bind(this)
|
||||
this.renderRoute = render.renderRoute.bind(this)
|
||||
// Add this.generate
|
||||
this.generate = generate.bind(this)
|
||||
// Launch build and set this.renderer
|
||||
@ -90,91 +92,6 @@ class Nuxt {
|
||||
})
|
||||
}
|
||||
|
||||
render (req, res) {
|
||||
if (!this.renderer) {
|
||||
setTimeout(() => {
|
||||
this.render(req, res)
|
||||
}, 1000)
|
||||
return
|
||||
}
|
||||
const self = this
|
||||
const context = getContext(req, res)
|
||||
co(function * () {
|
||||
if (self.dev) {
|
||||
// Call webpack middlewares only in development
|
||||
yield self.webpackDevMiddleware(req, res)
|
||||
yield self.webpackHotMiddleware(req, res)
|
||||
}
|
||||
// If base in req.url, remove it for the middlewares and vue-router
|
||||
if (self.options.router.base !== '/' && req.url.indexOf(self.options.router.base) === 0) {
|
||||
// Compatibility with base url for dev server
|
||||
req.url = req.url.replace(self.options.router.base, '/')
|
||||
}
|
||||
// Serve static/ files
|
||||
yield self.serveStatic(req, res)
|
||||
// Serve .nuxt/dist/ files (only for production)
|
||||
if (!self.dev && self._nuxtRegexp.test(req.url)) {
|
||||
const url = req.url
|
||||
req.url = req.url.replace(self._nuxtRegexp, '/')
|
||||
yield self.serveStaticNuxt(req, res)
|
||||
req.url = url
|
||||
}
|
||||
})
|
||||
.then(() => {
|
||||
if (this.dev && this._nuxtRegexp.test(req.url) && req.url.includes('.hot-update.json')) {
|
||||
res.statusCode = 404
|
||||
return res.end()
|
||||
}
|
||||
return this.renderRoute(req.url, context)
|
||||
})
|
||||
.then(({ html, error }) => {
|
||||
if (error) {
|
||||
res.statusCode = context.nuxt.error.statusCode || 500
|
||||
}
|
||||
res.setHeader('Content-Type', 'text/html; charset=utf-8')
|
||||
res.setHeader('Content-Length', Buffer.byteLength(html))
|
||||
res.end(html, 'utf8')
|
||||
})
|
||||
.catch((err) => {
|
||||
res.statusCode = 500
|
||||
res.end(this.errorTemplate({ err }), 'utf8')
|
||||
})
|
||||
}
|
||||
|
||||
renderRoute (url, context = {}) {
|
||||
debug(`Rendering url ${url}`)
|
||||
// Add url and isSever to the context
|
||||
context.url = url
|
||||
context.isServer = true
|
||||
// Call rendertoSting from the bundleRenderer and generate the HTML (will update the context as well)
|
||||
const self = this
|
||||
return co(function * () {
|
||||
let app = yield self.renderToString(context)
|
||||
if (context.nuxt && context.nuxt.error instanceof Error) {
|
||||
context.nuxt.error = { statusCode: 500, message: context.nuxt.error.message }
|
||||
}
|
||||
if (context.redirected) {
|
||||
app = '<div id="__nuxt"></div>'
|
||||
}
|
||||
const html = self.appTemplate({
|
||||
dev: self.dev, // Use to add the extracted CSS <link> in production
|
||||
baseUrl: self.options.router.base,
|
||||
APP: app,
|
||||
context: context,
|
||||
files: {
|
||||
css: urlJoin(self.options.router.base, '/_nuxt/', self.options.build.filenames.css),
|
||||
vendor: urlJoin(self.options.router.base, '/_nuxt/', self.options.build.filenames.vendor),
|
||||
app: urlJoin(self.options.router.base, '/_nuxt/', self.options.build.filenames.app)
|
||||
}
|
||||
})
|
||||
return {
|
||||
html,
|
||||
error: context.nuxt.error,
|
||||
redirected: context.redirected
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
close (callback) {
|
||||
let promises = []
|
||||
if (this.webpackDevMiddleware) {
|
||||
|
||||
89
lib/render.js
Normal file
89
lib/render.js
Normal file
@ -0,0 +1,89 @@
|
||||
const debug = require('debug')('nuxt:render')
|
||||
const co = require('co')
|
||||
const { urlJoin } = require('./utils')
|
||||
const { getContext } = require('./utils')
|
||||
|
||||
exports.render = function (req, res) {
|
||||
if (!this.renderer) {
|
||||
setTimeout(() => {
|
||||
this.render(req, res)
|
||||
}, 1000)
|
||||
return
|
||||
}
|
||||
const self = this
|
||||
const context = getContext(req, res)
|
||||
co(function * () {
|
||||
if (self.dev) {
|
||||
// Call webpack middlewares only in development
|
||||
yield self.webpackDevMiddleware(req, res)
|
||||
yield self.webpackHotMiddleware(req, res)
|
||||
}
|
||||
// If base in req.url, remove it for the middlewares and vue-router
|
||||
if (self.options.router.base !== '/' && req.url.indexOf(self.options.router.base) === 0) {
|
||||
// Compatibility with base url for dev server
|
||||
req.url = req.url.replace(self.options.router.base, '/')
|
||||
}
|
||||
// Serve static/ files
|
||||
yield self.serveStatic(req, res)
|
||||
// Serve .nuxt/dist/ files (only for production)
|
||||
if (!self.dev && self._nuxtRegexp.test(req.url)) {
|
||||
const url = req.url
|
||||
req.url = req.url.replace(self._nuxtRegexp, '/')
|
||||
yield self.serveStaticNuxt(req, res)
|
||||
req.url = url
|
||||
}
|
||||
})
|
||||
.then(() => {
|
||||
if (this.dev && this._nuxtRegexp.test(req.url) && req.url.includes('.hot-update.json')) {
|
||||
res.statusCode = 404
|
||||
return res.end()
|
||||
}
|
||||
return this.renderRoute(req.url, context)
|
||||
})
|
||||
.then(({ html, error }) => {
|
||||
if (error) {
|
||||
res.statusCode = context.nuxt.error.statusCode || 500
|
||||
}
|
||||
res.setHeader('Content-Type', 'text/html; charset=utf-8')
|
||||
res.setHeader('Content-Length', Buffer.byteLength(html))
|
||||
res.end(html, 'utf8')
|
||||
})
|
||||
.catch((err) => {
|
||||
res.statusCode = 500
|
||||
res.end(this.errorTemplate({ err }), 'utf8')
|
||||
})
|
||||
}
|
||||
|
||||
exports.renderRoute = function (url, context = {}) {
|
||||
debug(`Rendering url ${url}`)
|
||||
// Add url and isSever to the context
|
||||
context.url = url
|
||||
context.isServer = true
|
||||
// Call rendertoSting from the bundleRenderer and generate the HTML (will update the context as well)
|
||||
const self = this
|
||||
return co(function * () {
|
||||
let app = yield self.renderToString(context)
|
||||
if (context.nuxt && context.nuxt.error instanceof Error) {
|
||||
context.nuxt.error = { statusCode: 500, message: context.nuxt.error.message }
|
||||
}
|
||||
if (context.redirected) {
|
||||
app = '<div id="__nuxt"></div>'
|
||||
}
|
||||
const html = self.appTemplate({
|
||||
dev: self.dev, // Use to add the extracted CSS <link> in production
|
||||
baseUrl: self.options.router.base,
|
||||
APP: app,
|
||||
context: context,
|
||||
files: {
|
||||
css: urlJoin(self.options.router.base, '/_nuxt/', self.options.build.filenames.css),
|
||||
vendor: urlJoin(self.options.router.base, '/_nuxt/', self.options.build.filenames.vendor),
|
||||
app: urlJoin(self.options.router.base, '/_nuxt/', self.options.build.filenames.app)
|
||||
}
|
||||
})
|
||||
return {
|
||||
html,
|
||||
error: context.nuxt.error,
|
||||
redirected: context.redirected
|
||||
}
|
||||
})
|
||||
}
|
||||
Loading…
Reference in New Issue
Block a user