refactor: move more ssr logic into server-renderer package

This commit is contained in:
Evan You 2022-05-31 17:38:27 +08:00
parent 8d7793ff10
commit ff4f1fdf37
26 changed files with 132 additions and 123 deletions

View File

@ -14,7 +14,7 @@
"ssr"
],
"files": [
"types",
"types/*.d.ts",
"*.js",
"*.d.ts"
],

View File

@ -1,4 +1,4 @@
import { baseOptions } from '../compiler/options'
import { baseOptions } from 'web/compiler/options'
import { createCompiler } from 'server/optimizing-compiler/index'
const { compile, compileToFunctions } = createCompiler(baseOptions)

View File

@ -1,6 +1,6 @@
import modules from './server/modules/index'
import directives from './server/directives/index'
import { isUnaryTag, canBeLeftOpenTag } from './compiler/util'
import modules from './modules/index'
import directives from './directives/index'
import { isUnaryTag, canBeLeftOpenTag } from 'web/compiler/util'
import { createBasicRenderer } from 'server/create-basic-renderer'
export default createBasicRenderer({

View File

@ -1,9 +1,9 @@
process.env.VUE_ENV = 'server'
import { extend } from 'shared/util'
import modules from './server/modules/index'
import baseDirectives from './server/directives/index'
import { isUnaryTag, canBeLeftOpenTag } from './compiler/util'
import modules from './modules/index'
import baseDirectives from './directives/index'
import { isUnaryTag, canBeLeftOpenTag } from 'web/compiler/util'
import {
createRenderer as _createRenderer,

View File

@ -9,7 +9,7 @@ import {
convertEnumeratedValue
} from 'web/util/attrs'
import { isSSRUnsafeAttr } from 'web/server/util'
import { isSSRUnsafeAttr } from '../util'
import type { VNodeWithData } from 'types/vnode'
export default function renderAttrs(node: VNodeWithData): string {

View File

@ -20,7 +20,7 @@ import {
applyModelTransform
} from './modules'
import { escape } from 'web/server/util'
import { escape } from '../util'
import { optimizability } from './optimizer'
import type { CodegenResult } from 'compiler/codegen/index'
import { ASTElement, ASTNode, CompilerOptions } from 'types/compiler'

View File

@ -4,7 +4,7 @@ import {
EXPRESSION
} from './codegen'
import { propsToAttrMap, isRenderableAttr } from 'web/server/util'
import { propsToAttrMap, isRenderableAttr } from '../util'
import { isBooleanAttr, isEnumeratedAttr } from 'web/util/attrs'

View File

@ -1,8 +1,13 @@
import { escape, isSSRUnsafeAttr } from 'web/server/util'
import {
escape,
isSSRUnsafeAttr,
propsToAttrMap,
isRenderableAttr
} from '../util'
import { isObject, extend } from 'shared/util'
import { renderAttr } from 'web/server/modules/attrs'
import { renderAttr } from '../modules/attrs'
import { renderClass } from 'web/util/class'
import { genStyle } from 'web/server/modules/style'
import { genStyle } from '../modules/style'
import { normalizeStyleBinding } from 'web/util/style'
import {
@ -10,7 +15,6 @@ import {
simpleNormalizeChildren
} from 'core/vdom/helpers/normalize-children'
import { propsToAttrMap, isRenderableAttr } from 'web/server/util'
import type { Component } from 'types/component'
const ssrHelpers = {

View File

@ -1,9 +1,9 @@
import { escape } from 'web/server/util'
import { escape } from './util'
import { SSR_ATTR } from 'shared/constants'
import { RenderContext } from './render-context'
import { resolveAsset } from 'core/util/options'
import { generateComponentTrace } from 'core/util/debug'
import { ssrCompileToFunctions } from 'web/server/compiler'
import { ssrCompileToFunctions } from './compiler'
import { installSSRHelpers } from './optimizing-compiler/runtime-helpers'
import { isDef, isUndef, isTrue } from 'shared/util'

View File

@ -1,3 +1,101 @@
import { makeMap } from 'shared/util'
const isAttr = makeMap(
'accept,accept-charset,accesskey,action,align,alt,async,autocomplete,' +
'autofocus,autoplay,autosave,bgcolor,border,buffered,challenge,charset,' +
'checked,cite,class,code,codebase,color,cols,colspan,content,' +
'contenteditable,contextmenu,controls,coords,data,datetime,default,' +
'defer,dir,dirname,disabled,download,draggable,dropzone,enctype,for,' +
'form,formaction,headers,height,hidden,high,href,hreflang,http-equiv,' +
'icon,id,ismap,itemprop,keytype,kind,label,lang,language,list,loop,low,' +
'manifest,max,maxlength,media,method,GET,POST,min,multiple,email,file,' +
'muted,name,novalidate,open,optimum,pattern,ping,placeholder,poster,' +
'preload,radiogroup,readonly,rel,required,reversed,rows,rowspan,sandbox,' +
'scope,scoped,seamless,selected,shape,size,type,text,password,sizes,span,' +
'spellcheck,src,srcdoc,srclang,srcset,start,step,style,summary,tabindex,' +
'target,title,usemap,value,width,wrap'
)
const unsafeAttrCharRE = /[>/="'\u0009\u000a\u000c\u0020]/ // eslint-disable-line no-control-regex
export const isSSRUnsafeAttr = (name: string): boolean => {
return unsafeAttrCharRE.test(name)
}
/* istanbul ignore next */
const isRenderableAttr = (name: string): boolean => {
return (
isAttr(name) || name.indexOf('data-') === 0 || name.indexOf('aria-') === 0
)
}
export { isRenderableAttr }
export const propsToAttrMap = {
acceptCharset: 'accept-charset',
className: 'class',
htmlFor: 'for',
httpEquiv: 'http-equiv'
}
const ESC = {
'<': '&lt;',
'>': '&gt;',
'"': '&quot;',
'&': '&amp;'
}
export function escape(s: string) {
return s.replace(/[<>"&]/g, escapeChar)
}
function escapeChar(a) {
return ESC[a] || a
}
export const noUnitNumericStyleProps = {
'animation-iteration-count': true,
'border-image-outset': true,
'border-image-slice': true,
'border-image-width': true,
'box-flex': true,
'box-flex-group': true,
'box-ordinal-group': true,
'column-count': true,
columns: true,
flex: true,
'flex-grow': true,
'flex-positive': true,
'flex-shrink': true,
'flex-negative': true,
'flex-order': true,
'grid-row': true,
'grid-row-end': true,
'grid-row-span': true,
'grid-row-start': true,
'grid-column': true,
'grid-column-end': true,
'grid-column-span': true,
'grid-column-start': true,
'font-weight': true,
'line-clamp': true,
'line-height': true,
opacity: true,
order: true,
orphans: true,
'tab-size': true,
widows: true,
'z-index': true,
zoom: true,
// SVG
'fill-opacity': true,
'flood-opacity': true,
'stop-opacity': true,
'stroke-dasharray': true,
'stroke-dashoffset': true,
'stroke-miterlimit': true,
'stroke-opacity': true,
'stroke-width': true
}
export const isJS = (file: string): boolean => /\.js(\?[^.]+)?$/.test(file)
export const isCSS = (file: string): boolean => /\.css(\?[^.]+)?$/.test(file)

View File

@ -2,7 +2,7 @@ import path from 'path'
import webpack from 'webpack'
import MemoryFS from 'memory-fs'
import { RenderOptions } from 'server/create-renderer'
import { createBundleRenderer } from 'web/entry-server-renderer'
import { createBundleRenderer } from 'server/index'
import VueSSRServerPlugin from 'server/webpack-plugin/server'
export function compileWithWebpack(

View File

@ -1,7 +1,7 @@
// @vitest-environment node
import Vue from 'vue'
import renderToString from 'web/entry-server-basic-renderer'
import renderToString from 'server/index-basic'
describe('SSR: basicRenderer', () => {
it('should work', done => {

View File

@ -1,7 +1,7 @@
// @vitest-environment node
import Vue from 'vue'
import { createRenderer } from 'web/entry-server-renderer'
import { createRenderer } from 'server/index'
const { renderToStream } = createRenderer()
describe('SSR: renderToStream', () => {

View File

@ -2,7 +2,7 @@
import Vue from 'vue'
import VM from 'vm'
import { createRenderer } from 'web/entry-server-renderer'
import { createRenderer } from 'server/index'
const { renderToString } = createRenderer()
describe('SSR: renderToString', () => {

View File

@ -5,7 +5,7 @@ import {
compileWithWebpack,
createWebpackBundleRenderer
} from './compile-with-webpack'
import { createRenderer } from 'web/entry-server-renderer'
import { createRenderer } from 'server/index'
import VueSSRClientPlugin from 'server/webpack-plugin/client'
import { RenderOptions } from 'server/create-renderer'

View File

@ -7,6 +7,10 @@
"jsdelivr": "browser.js",
"browser": "browser.js",
"types": "types/index.d.ts",
"files": [
"types/*.d.ts",
"*.js"
],
"repository": {
"type": "git",
"url": "git+https://github.com/vuejs/vue.git"

View File

@ -147,7 +147,7 @@ const builds = {
},
// Web server renderer (CommonJS).
'server-renderer-dev': {
entry: resolve('web/entry-server-renderer.ts'),
entry: resolve('packages/server-renderer/src/index.ts'),
dest: resolve('packages/server-renderer/build.dev.js'),
format: 'cjs',
env: 'development',
@ -159,7 +159,7 @@ const builds = {
]
},
'server-renderer-prod': {
entry: resolve('web/entry-server-renderer.ts'),
entry: resolve('server/index.ts'),
dest: resolve('packages/server-renderer/build.prod.js'),
format: 'cjs',
env: 'production',
@ -171,7 +171,7 @@ const builds = {
]
},
'server-renderer-basic': {
entry: resolve('web/entry-server-basic-renderer.ts'),
entry: resolve('server/index-basic.ts'),
dest: resolve('packages/server-renderer/basic.js'),
format: 'umd',
env: 'development',

View File

@ -1,4 +1,4 @@
export { parseComponent } from 'sfc/parser'
export { compile, compileToFunctions } from './compiler/index'
export { ssrCompile, ssrCompileToFunctions } from './server/compiler'
export { ssrCompile, ssrCompileToFunctions } from 'server/compiler'
export { generateCodeFrame } from 'compiler/codeframe'

View File

@ -1,97 +0,0 @@
import { makeMap } from 'shared/util'
const isAttr = makeMap(
'accept,accept-charset,accesskey,action,align,alt,async,autocomplete,' +
'autofocus,autoplay,autosave,bgcolor,border,buffered,challenge,charset,' +
'checked,cite,class,code,codebase,color,cols,colspan,content,' +
'contenteditable,contextmenu,controls,coords,data,datetime,default,' +
'defer,dir,dirname,disabled,download,draggable,dropzone,enctype,for,' +
'form,formaction,headers,height,hidden,high,href,hreflang,http-equiv,' +
'icon,id,ismap,itemprop,keytype,kind,label,lang,language,list,loop,low,' +
'manifest,max,maxlength,media,method,GET,POST,min,multiple,email,file,' +
'muted,name,novalidate,open,optimum,pattern,ping,placeholder,poster,' +
'preload,radiogroup,readonly,rel,required,reversed,rows,rowspan,sandbox,' +
'scope,scoped,seamless,selected,shape,size,type,text,password,sizes,span,' +
'spellcheck,src,srcdoc,srclang,srcset,start,step,style,summary,tabindex,' +
'target,title,usemap,value,width,wrap'
)
const unsafeAttrCharRE = /[>/="'\u0009\u000a\u000c\u0020]/ // eslint-disable-line no-control-regex
export const isSSRUnsafeAttr = (name: string): boolean => {
return unsafeAttrCharRE.test(name)
}
/* istanbul ignore next */
const isRenderableAttr = (name: string): boolean => {
return (
isAttr(name) || name.indexOf('data-') === 0 || name.indexOf('aria-') === 0
)
}
export { isRenderableAttr }
export const propsToAttrMap = {
acceptCharset: 'accept-charset',
className: 'class',
htmlFor: 'for',
httpEquiv: 'http-equiv'
}
const ESC = {
'<': '&lt;',
'>': '&gt;',
'"': '&quot;',
'&': '&amp;'
}
export function escape(s: string) {
return s.replace(/[<>"&]/g, escapeChar)
}
function escapeChar(a) {
return ESC[a] || a
}
export const noUnitNumericStyleProps = {
'animation-iteration-count': true,
'border-image-outset': true,
'border-image-slice': true,
'border-image-width': true,
'box-flex': true,
'box-flex-group': true,
'box-ordinal-group': true,
'column-count': true,
columns: true,
flex: true,
'flex-grow': true,
'flex-positive': true,
'flex-shrink': true,
'flex-negative': true,
'flex-order': true,
'grid-row': true,
'grid-row-end': true,
'grid-row-span': true,
'grid-row-start': true,
'grid-column': true,
'grid-column-end': true,
'grid-column-span': true,
'grid-column-start': true,
'font-weight': true,
'line-clamp': true,
'line-height': true,
opacity: true,
order: true,
orphans: true,
'tab-size': true,
widows: true,
'z-index': true,
zoom: true,
// SVG
'fill-opacity': true,
'flood-opacity': true,
'stop-opacity': true,
'stroke-dasharray': true,
'stroke-dashoffset': true,
'stroke-miterlimit': true,
'stroke-opacity': true,
'stroke-width': true
}