From a678270814355e936bc34d486ff314ec7b7960b5 Mon Sep 17 00:00:00 2001 From: sunhao Date: Fri, 28 Jun 2019 15:27:44 +0800 Subject: [PATCH] =?UTF-8?q?feat:=20=E5=AE=8C=E5=96=84=20doc=20=E4=BE=8B?= =?UTF-8?q?=E5=AD=90?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- @types/index.d.ts | 7 +++- doc/@types/index.d.ts | 44 +++++++++++++++---- doc/build/webpack.extensions.conf.babel.js | 2 +- doc/server/{index.js => index.ts} | 0 doc/server/middlewares.js | 22 ---------- doc/server/middlewares.ts | 27 ++++++++++++ doc/server/{router.js => router.ts} | 4 +- doc/src/entry-server.ts | 4 +- doc/src/envs.ts | 2 +- doc/src/store/index.ts | 49 ++++++++++++++++++---- doc/src/store/mutations.ts | 8 +++- doc/src/store/state.ts | 4 +- doc/src/views/index.vue | 31 +++++++++++++- doc/tsconfig.json | 2 +- src/utils/index.ts | 15 +++---- 15 files changed, 165 insertions(+), 56 deletions(-) rename doc/server/{index.js => index.ts} (100%) delete mode 100644 doc/server/middlewares.js create mode 100644 doc/server/middlewares.ts rename doc/server/{router.js => router.ts} (88%) diff --git a/@types/index.d.ts b/@types/index.d.ts index b800c67..61d9101 100644 --- a/@types/index.d.ts +++ b/@types/index.d.ts @@ -411,16 +411,19 @@ declare namespace build { } } + /** + * build 工具 + */ namespace utils { /** * Express 路由 栈管理中心 */ - class RouterStackManagement { + interface RouterStackManagement { /** * 热更新 中间件 * @param middlewares 中间件 */ - unpdate: (middlewares: any[]) => void + update: (middlewares: any[]) => void } namespace Get { diff --git a/doc/@types/index.d.ts b/doc/@types/index.d.ts index 697fe58..fca7e9c 100644 --- a/doc/@types/index.d.ts +++ b/doc/@types/index.d.ts @@ -12,7 +12,7 @@ declare namespace Doc { * vuex 创建 工具函数 * * typescript namespace */ - namespace TcreateUtils { + namespace createUtils { type ActionDescriptor = [any, any] /** @@ -35,16 +35,44 @@ declare namespace Doc { */ interface state { /** - * 是否 使用 移动设备 访问 - * * 来自服务器端 + * 全局 */ - isMobile: boolean + global: { + /** + * 是否 使用 移动设备 访问 + * * 来自服务器端 + * * 这是一个例子 + */ + isMobile: boolean + + /** + * 是否 使用 移动设备 访问 + * * 来自 中间件-服务器端 + * * 这是一个例子 + */ + hello: string + + /** + * 测试 热加载 vuex + * * 来自 客户端 + * * 这是一个例子 + */ + testHotLoadingVuex: number + + /** + * 初始化 跳转访问 URL + * * 来自服务器端 + * * 这是一个例子 + */ + initialReplaceStateUrl: string + } /** - * 初始化 跳转访问 URL - * * 来自服务器端 + * 编辑器 */ - initialReplaceStateUrl: string + editor: { + test: string + } } /** @@ -56,6 +84,8 @@ declare namespace Doc { */ global: { SET_IS_MOBILE: boolean + SET_HELLO: { hello: string } + SET_testHotLoadingVuex: { number: number } } /** diff --git a/doc/build/webpack.extensions.conf.babel.js b/doc/build/webpack.extensions.conf.babel.js index d634890..84e1593 100644 --- a/doc/build/webpack.extensions.conf.babel.js +++ b/doc/build/webpack.extensions.conf.babel.js @@ -1,7 +1,7 @@ export default function(config, { resolve }) { return { entry: { - extensions: resolve('./server/index.js'), + extensions: resolve('./server/index.ts'), }, path: config.assetRoot } diff --git a/doc/server/index.js b/doc/server/index.ts similarity index 100% rename from doc/server/index.js rename to doc/server/index.ts diff --git a/doc/server/middlewares.js b/doc/server/middlewares.js deleted file mode 100644 index f158070..0000000 --- a/doc/server/middlewares.js +++ /dev/null @@ -1,22 +0,0 @@ -/** - * 根据路由匹配的页面 中间件 - */ -const middlewares = [ - { - path: '/', - methods: 'GET', - handle: (req, res, next) => { - req.renderContext = { - serverStore: { - hello: 'hello word. 这里可用于 使用服务器内存 缓存数据.' - }, - } - next() - }, - }, -] - -export function middlewaresExtension(app, routerStackManagement) { - routerStackManagement.update(middlewares) - console.log('middlewaresExtension init') -} \ No newline at end of file diff --git a/doc/server/middlewares.ts b/doc/server/middlewares.ts new file mode 100644 index 0000000..87ad81b --- /dev/null +++ b/doc/server/middlewares.ts @@ -0,0 +1,27 @@ +import { utils } from '@bestminr/build' + +/** + * 根据路由匹配的页面 中间件 + */ +const middlewares = [ + { + path: '/', + methods: 'GET', + handle: (req, res, next) => { + req.injectContext = { + middlewaresContent: { + serverStore: { + hello: 'hello word. 这里可用于 使用服务器内存 缓存数据.' + }, + } + } + console.log('调用了', req.injectContext) + next() + }, + }, +] + +export function middlewaresExtension(app, routerStackManagement: utils.RouterStackManagement) { + routerStackManagement.update(middlewares) + console.log('middlewaresExtension init') +} \ No newline at end of file diff --git a/doc/server/router.js b/doc/server/router.ts similarity index 88% rename from doc/server/router.js rename to doc/server/router.ts index 3c0b545..27b540b 100644 --- a/doc/server/router.js +++ b/doc/server/router.ts @@ -16,13 +16,13 @@ export function routerExtension(app) { const router = express.Router() - //*** 自己编写的-请求中间件 + // *** 自己编写的-请求中间件 router.get(`/version`, (req, res) => { return res.json({ version }) }) - //*** end 自己编写的-请求中间件 + // *** end 自己编写的-请求中间件 app.use('/private', router) console.log('routerExtension init') diff --git a/doc/src/entry-server.ts b/doc/src/entry-server.ts index 86ae372..23029a3 100644 --- a/doc/src/entry-server.ts +++ b/doc/src/entry-server.ts @@ -19,7 +19,7 @@ function isMobilePageUrl(url) { // return a Promise that resolves to the app instance. export default context => { // hostGlobal.__INJECT_CONTEXT__ = context - // console.log('server url = ', context.url, ' server context.renderContext = ', context.renderContext) + // console.log('server url = ', context.url, ' server context.injectContext.middlewaresContent = ', context.injectContext.middlewaresContent) return new Promise((resolve, reject) => { const s = !isProduction && Date.now() @@ -71,7 +71,7 @@ export default context => { cookies, stage: 'server-onReady', matchedComponents, - }, context.renderContext) + }, context.injectContext.middlewaresContent) const asyncDataResults = callComponentsHookWith(matchedComponents, 'asyncData', callComponentsHookWithOptions) // Call fetchData hooks on components matched by the route. diff --git a/doc/src/envs.ts b/doc/src/envs.ts index e4ec86d..9722fa4 100644 --- a/doc/src/envs.ts +++ b/doc/src/envs.ts @@ -25,7 +25,7 @@ export interface HostGlobal extends Window { /** * vuex 实例 */ - store: Store + store: Store /** * vue router 实例 diff --git a/doc/src/store/index.ts b/doc/src/store/index.ts index 41cad0f..a6a853f 100644 --- a/doc/src/store/index.ts +++ b/doc/src/store/index.ts @@ -9,12 +9,12 @@ import { Tstore } from '@types' Vue.use(Vuex) -function isStore(context: any) { +function isStore(context: Store) { return 'strict' in context } export function createStore() { - return new Vuex.Store({ + return new Vuex.Store({ state: state(), actions, mutations, @@ -23,19 +23,51 @@ export function createStore() { }) } -type createMutationPayloads = { global: any } +type StoreTypeBounds = { global: any } -function createCommit() { - function commit( +function createGetState() { + function getState( + context: Store, + state: K, + ): T['global'][K] + function getState( + context: Store, + namespace: NS, + state: K, + ): T[NS][K] + function getState(context: Store, ...args: any[]): void { + let namespace: string, state: string + if (args.length === 2) { + namespace = args[0] + state = args[1] + } else if (args.length === 1) { + namespace = 'global' + state = args[0] + } + + if (namespace !== 'global') { + return context.state[namespace][state] + } + return context.state[state] + } + + return getState +} + +export const getState = createGetState() + + +function createCommit() { + function commit( context: Store, mutation: K, - payload: MutationPayloads['global'][K], + payload: T['global'][K], ): void - function commit( + function commit( context: Store, namespace: NS, mutation: K, - payload: MutationPayloads[NS][K], + payload: T[NS][K], ): void function commit(context: Store, ...args: any[]): void { let namespace: string, mutation: string, payload: any @@ -59,6 +91,7 @@ function createCommit() { } export const commit = createCommit() + // const store = this.store // commit(store, 'SET_IS_MOBILE', false) diff --git a/doc/src/store/mutations.ts b/doc/src/store/mutations.ts index c521e1b..ba2ae03 100644 --- a/doc/src/store/mutations.ts +++ b/doc/src/store/mutations.ts @@ -1,10 +1,16 @@ import { Tstore } from "@types" -export const mutations: Tstore.TcreateUtils.ModuleMutations = { +export const mutations: Tstore.createUtils.ModuleMutations = { SET_IS_MOBILE: (state, isMobile) => { console.log('SET_IS_MOBILE', isMobile) state.isMobile = isMobile }, + SET_HELLO: (state, { hello }) => { + state.hello = hello + }, + SET_testHotLoadingVuex: (state, { number }) => { + state.testHotLoadingVuex += number * 1 + }, } export default mutations \ No newline at end of file diff --git a/doc/src/store/state.ts b/doc/src/store/state.ts index b09bf5c..92985bf 100644 --- a/doc/src/store/state.ts +++ b/doc/src/store/state.ts @@ -1,8 +1,10 @@ import { Tstore } from '@types' -export default function state(): Tstore.state { +export default function state(): Tstore.state['global'] { return { isMobile: false, + hello: '', + testHotLoadingVuex: 0, initialReplaceStateUrl: '', } } diff --git a/doc/src/views/index.vue b/doc/src/views/index.vue index d399502..def959f 100644 --- a/doc/src/views/index.vue +++ b/doc/src/views/index.vue @@ -1,4 +1,8 @@ \ No newline at end of file diff --git a/doc/tsconfig.json b/doc/tsconfig.json index 0534be5..d2eed66 100644 --- a/doc/tsconfig.json +++ b/doc/tsconfig.json @@ -24,6 +24,6 @@ "keyofStringsOnly": true, "lib": ["dom", "es5", "es6", "scripthost", "es2018.promise", "webworker"] }, - "include": ["tests", "src", "src/**/*.vue", "@types/*"], + "include": ["tests", "src", "server", "src/**/*.vue", "@types/*"], "exclude": ["node_modules", "*node_modules*", "dist", "docs", ".tmp", "build"] } diff --git a/src/utils/index.ts b/src/utils/index.ts index 48208a1..dbecaf5 100644 --- a/src/utils/index.ts +++ b/src/utils/index.ts @@ -302,6 +302,7 @@ export async function initConfig( return options } + /** * 检测 是否启用 dll 启动 * * **必须** 放置在 **setWebpack** 设置webpack **之前** @@ -510,16 +511,16 @@ export function isRouterExtensionPath(path: string) { /** * Express 路由 栈管理中心 */ -class RouterStackManagement { - enabled = false +export class RouterStackManagement { + private enabled = false - startIndex = 0 - hotUpDateCount = 0 + private startIndex = 0 + private hotUpDateCount = 0 app?: Express router?: Router - store: any[] = [] + private store: any[] = [] init(app: Express) { if (this.enabled) return @@ -548,7 +549,7 @@ class RouterStackManagement { this.router.stack = stack } - use({ + private use({ index, middleware: { path, methods, handle } }: { @@ -583,7 +584,7 @@ class RouterStackManagement { * 热更新 中间件 * @param middlewares 中间件 */ - update(middlewares: any[]) { + protected update(middlewares: any[]) { if (isProduction) { return middlewares.forEach(({ path, methods, handle }) => { ;(this.app as any)[methods.toLocaleLowerCase()](path, handle)