diff --git a/examples/jiti.js b/examples/jiti.js index 3167708..149239d 100644 --- a/examples/jiti.js +++ b/examples/jiti.js @@ -1,21 +1,13 @@ const path = require('path') -const { transformSync } = require('@babel/core') module.exports = require('jiti')(__filename, { cache: false, debug: false, - transform (opts) { - const _opts = { - babelrc: false, - configFile: false, - compact: false, - retainLines: typeof opts.retainLines === 'boolean' ? opts.retainLines : true, - filename: '', - cwd: '/', + transformOptions: { + ts: true, + retainLines: true, + babel: { plugins: [ - [require('@babel/plugin-transform-modules-commonjs'), { allowTopLevelThis: true }], - [require('@babel/plugin-transform-typescript')], - [require('babel-plugin-dynamic-import-node'), { noInterop: true }], [require('babel-plugin-global-define'), { __DEV__: true, __BROWSER__: false @@ -24,22 +16,11 @@ module.exports = require('jiti')(__filename, { root: '.', extensions: ['.ts'], alias: { - '^vue-meta$': path.resolve(__dirname, '../src/') + '^vue-meta$': path.resolve(__dirname, '../src/'), + '^vue-meta/ssr$': path.resolve(__dirname, '../src/ssr') } }] ] } - - try { - return transformSync(opts.source, _opts).code || '' - } catch (err) { - return 'exports.__JITI_ERROR__ = ' + JSON.stringify({ - filename: opts.filename, - line: (err.loc && err.loc.line) || 0, - column: (err.loc && err.loc.column) || 0, - code: err.code && err.code.replace('BABEL_', '').replace('PARSE_ERROR', 'ParseError'), - message: err.message.replace('/: ', '').replace(/\(.+\)\s*$/, '') - }) - } } }) diff --git a/examples/server.js b/examples/server.js index 7eb40dc..1a3af44 100644 --- a/examples/server.js +++ b/examples/server.js @@ -41,10 +41,10 @@ app.use((req, res, next) => { // the examples without errors in the browser if (req.url.endsWith('.js')) { res.setHeader('Content-Type', 'application/javascript') - res.send('') + res.send('/* empty */') } else if (req.url.endsWith('.css')) { res.setHeader('Content-Type', 'text/css') - res.send('') + res.send('/* empty */') } else { next() } diff --git a/examples/ssr/app.template.html b/examples/ssr/app.template.html index 42b4d4a..38174c9 100644 --- a/examples/ssr/app.template.html +++ b/examples/ssr/app.template.html @@ -5,10 +5,10 @@ - {{ bodyPrepend }} +
{{ bodyPrepend }}
← Examples index - {{ app }} +
{{ app }}
{{ bodyAppend }} diff --git a/examples/ssr/browser.js b/examples/ssr/browser.js index f9c3c87..12df66b 100644 --- a/examples/ssr/browser.js +++ b/examples/ssr/browser.js @@ -1,9 +1,6 @@ -import { createApp } from 'vue' -import { App, createRouter, metaManager } from '../vue-router/main' +import { createApp } from '../vue-router/main' window.users = [] -const app = createApp(App) -app.use(createRouter('/ssr')) -app.use(metaManager) -app.mount('#app') +const { app, router } = createApp('/ssr', null) +router.isReady().then(() => app.mount('#app')) diff --git a/examples/ssr/server.js b/examples/ssr/server.js index e743948..c9b3d2e 100644 --- a/examples/ssr/server.js +++ b/examples/ssr/server.js @@ -1,10 +1,11 @@ import path from 'path' import fs from 'fs-extra' -import { createSSRApp } from 'vue' -import { renderToStringWithMeta } from 'vue-meta' +import { renderToString } from '@vue/server-renderer' + +import { renderMetaToString } from 'vue-meta/ssr' import template from 'lodash/template' -import { App, createRouter, metaManager } from '../vue-router/main' +import { createApp } from '../vue-router/main' const templateFile = path.resolve(__dirname, 'app.template.html') const templateContent = fs.readFileSync(templateFile, { encoding: 'utf8' }) @@ -17,17 +18,13 @@ process.server = true export async function renderPage ({ url }) { console.log('renderPage', url) - const app = createSSRApp(App) - const router = createRouter('/ssr', true) - - app.use(router) - app.use(metaManager) - - await router.push(url.substr(4)) - + const { app, router } = createApp('/ssr', true) + router.push(url.slice(4)) await router.isReady() - const [appHtml, ctx] = await renderToStringWithMeta(app) + const ctx = {} + const appHtml = await renderToString(app, ctx) + await renderMetaToString(app, ctx) if (!ctx.teleports) { ctx.teleports = {} diff --git a/examples/vue-router/App.js b/examples/vue-router/App.ts similarity index 86% rename from examples/vue-router/App.js rename to examples/vue-router/App.ts index 0ca6da7..9b8ad21 100644 --- a/examples/vue-router/App.js +++ b/examples/vue-router/App.ts @@ -1,5 +1,5 @@ import { watch } from 'vue' -import { useMeta, useActiveMeta } from 'vue-meta' +import { useMeta, useActiveMeta } from '../../src' export default { setup () { @@ -32,7 +32,7 @@ export default { body: 'body-script1.js', // TODO: fix htmlAttrs: { amp: true, - lang: ['en', 'nl'] + lang: ['en'] }, bodyAttrs: { class: ['theme-dark'] @@ -44,7 +44,7 @@ export default { // TODO { content: 'window.a = "
";