express-tsx - npm Package Compare versions

Comparing version 3.0.31 to 3.0.32

lib/Render.js

@@ -21,2 +21,13 @@ "use strict";
 exports.defaultOptions = new Options();
+exports.filterKeys = ['_locals', 'settings', 'cache', 'req', 'res'];
+exports.getViewData = (data) => Object.keys(data).filter(key => exports.filterKeys.indexOf(key) === -1)
+    .reduce((target, key) => (target[key] = data[key], target), {});
+class config {
+    constructor(data) {
+        this.title = 'express-tsx';
+        this.lang = 'en';
+        configExtend(this, data);
+    }
+}
+exports.config = config;
 function Render(options) {
@@ -27,9 +38,27 @@ let { ssr, ssrRender, ssrWrap, placeholder } = configExtend({}, exports.defaultOptions, options);
         let body = placeholder;
+        let req = data.req;
+        let res = data.res;
         try {
-            if (ssr) {
-                let exports = require(file);
-                let render = exports && exports.View || exports.default || exports;
-                body = ssrRender(render, data);
+            let ViewData = exports.getViewData(data);
+            let callback = req.query.callback;
+            switch (true) {
+                case typeof callback === 'string':
+                    body = JSON.stringify(ViewData);
+                    if (callback.length) {
+                        res.type('js');
+                        body = `typeof ${callback} === 'function' && ${callback}(${body})`;
+                    }
+                    else {
+                        res.type('json');
+                    }
+                    break;
+                default:
+                    if (ssr) {
+                        let exports = require(file);
+                        let render = exports && exports.View || exports.default || exports;
+                        body = ssrRender(render, ViewData);
+                    }
+                    body = ssrWrap(body, ViewData, file, data);
+                    break;
             }
-            body = ssrWrap(body, file, data);
         }
@@ -36,0 +65,0 @@ catch (e) {

lib/ssrWrap/Compile/Compile.js

@@ -39,5 +39,2 @@ "use strict";
                     let shot = target[filename] = new Shot(filename);
-                    // for(let key in target){
-                    //   target[key].expired = true
-                    // }
                 }
@@ -44,0 +41,0 @@ return target[filename];

lib/ssrWrap/middleware.js

@@ -6,30 +6,10 @@ "use strict";
 const Compile_1 = require("./Compile");
-const configExtend = require("config-extend");
-class config {
-    constructor(data) {
-        //placeholder
-        this.title = 'express-tsx';
-        this.lang = 'en';
-        configExtend(this, data);
-    }
-}
-exports.config = config;
+exports.extname_use_express_tsx = ['.tsx'];
 exports.middleware.use(function (req, res, next) {
-    let originRender = res.render;
+    res.locals.res = res;
     res.locals.req = req;
-    res.locals.res = res;
-    res.render = function (file, data = {}) {
-        if (req.query.callback === 'define') {
-            res.jsonp(data);
-        }
-        else {
-            res.ViewData = Object.assign({}, data);
-            originRender.apply(this, arguments);
-        }
-        return this;
-    };
     next();
 });
 exports.basePath = '/express-tsx';
-exports.MaxAge = 60 * 60 * 12;
+exports.maxAge = 60 * 60 * 12;
 const push_1 = require("./push");
@@ -39,3 +19,3 @@ const url_1 = require("url");
     res.type('js');
-    res.setHeader('cache-control', 'max-age=' + exports.MaxAge);
+    res.setHeader('cache-control', 'max-age=' + exports.maxAge);
     let module = decodeURI(url_1.parse(req.url).pathname).slice(1);
@@ -42,0 +22,0 @@ module = module.replace(/\.(js|tsx|ts|jsx)$/, '');

lib/ssrWrap/push.js

@@ -14,3 +14,3 @@ "use strict";
         'content-type': 'application/javascript',
-        'Cache-Control': 'max-age=' + middleware_1.MaxAge,
+        'Cache-Control': 'max-age=' + middleware_1.maxAge,
     }
@@ -31,6 +31,8 @@ };
 exports.ssrEtag = module => module + '?v=' + exports.etag(module);
-exports.push = (file, data) => {
-    data = new middleware_2.config(data);
+const ssrWrap_1 = require("./ssrWrap");
+const requirejs_1 = require("./requirejs");
+exports.push = function push(body, ViewData, file, data) {
     let req = data.req;
     let res = data.res;
+    //make dataurl
     let url = url_1.parse(req.originalUrl);
@@ -40,23 +42,30 @@ url.search = url.search || '';
     let dataurl = url_1.format(url);
-    let imports = Compile_1.compile.getImports(file);
+    //get imports
+    let imports = Compile_1.compile.getImports(file).concat([requirejs_1.requirejsConfigPath, ssrWrap_1.bowerRenderScript]);
+    //get need preload_imports
     res.setHeader('ETag', encodeURI(imports.map(exports.ssrEtag).join(';')));
     let preloaded = decodeURI((req.header('if-none-match') || '')).split(';');
     let preload_imports = lodash_1.difference(imports.map(exports.ssrEtag), preloaded).map(m => m.split('?')[0]);
-    // debugger
     let relativePath = path_1.join(req.app.path(), middleware_2.basePath).replace(/\\/g, '/');
+    /**map module to absolute url */
     let pushEtag = module => encodeURI(`${relativePath}/${module.replace(/\.(tsx|ts|js|jsx)$/, '')}?v=${exports.etag(module)}`);
     let preload_imports_path = preload_imports.map(pushEtag);
+    // http2 push
     if (res.push) {
-        res.push(dataurl, exports.dataContentType).end(`define(${JSON.stringify(res.ViewData)})`);
+        res.push(dataurl, exports.dataContentType).end(`define(${JSON.stringify(ViewData)})`);
         preload_imports.forEach((module, index) => {
             let modulePath = preload_imports_path[index];
             let body = Compile_1.compile.compile(module).outputFiles[0].text;
-            res.push(modulePath, configExtend({ response: { ETag: exports.etag(body) } }, exports.contentType)).end(body);
+            res.push(modulePath, configExtend({ response: { ETag: exports.etag(module) } }, exports.contentType)).end(body);
             return modulePath;
         });
     }
-    data.imports = [dataurl].concat(imports.map(pushEtag));
+    //preload
     res.setHeader('Link', [dataurl].concat(preload_imports_path).map(path => `<${path}>; rel=preload; as=script`).join(','));
-    return data;
+    //return  dataurl and imports
+    return {
+        imports: [dataurl].concat(imports.map(pushEtag)),
+        pushEtag,
+    };
 };
 //# sourceMappingURL=push.js.map

lib/ssrWrap/requirejs.js

@@ -14,7 +14,10 @@ "use strict";
 };
-exports.requirejsConfig = (requirejsConfig) => {
+const fs = require("fs");
+const Compile_1 = require("./Compile");
+exports.requirejsConfigPath = Compile_1.compile.files[require.resolve('./_requirejs.config')].filename;
+exports.requirejsConfig = (requirejsConfig) => new Promise((resolve, reject) => {
     configExtend(exports.requirejs, requirejsConfig);
-    exports.requirejsScript = 'var requirejs=' + JSON.stringify(exports.requirejs);
-};
+    fs.writeFileSync(exports.requirejsConfigPath, 'var requirejs=' + JSON.stringify(exports.requirejs));
+});
 exports.requirejsConfig(); // init , create requirejsBuffer
 //# sourceMappingURL=requirejs.js.map

lib/ssrWrap/ssrWrap.js

 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 const requirejs_1 = require("./requirejs");
+const _1 = require("../");
 const push_1 = require("./push");
-exports.wrap = (body, file, data) => {
-    data = push_1.push(file, data);
+const Compile_1 = require("./Compile");
+exports.bowerRenderScript = Compile_1.compile.files[require.resolve('./bowerRender')].filename;
+exports.wrap = function (body, ViewData, file, data) {
+    ViewData = new _1.config(ViewData);
+    let { imports, pushEtag } = push_1.push(body, ViewData, file, data);
+    let [requirejsConfigPath, bowerRenderScript] = imports.slice(-2);
     return `
 <!DOCTYPE html>
-<html lang="${data.lang}">
+<html lang="${ViewData.lang}">
 <head>
@@ -14,31 +19,11 @@ <meta charset="UTF-8"/>
 <meta http-equiv="X-UA-Compatible" content="ie=edge"/>
-<title>${data.title}</title>
+<title>${ViewData.title}</title>
 </head>
 <body>
   <div id="app">${body}</div>
-  <script>${requirejs_1.requirejsScript}</script>
+  <script src="${requirejsConfigPath}"></script>
   <script src="${requirejs_1.requirejs.paths['requirejs']}.js"></script>
+  <script src="${bowerRenderScript}">${JSON.stringify(imports)}</script>
   <script>
-  var imports = ${JSON.stringify(data.imports)}.slice(1)
-  var importsMap = imports.reduce(function(map,module_and_version){
-    var module = module_and_version.split('?')[0]
-        map[module] = module_and_version
-    return map
-  },{})
-  requirejs.config({
-    map:imports.reduce(function(map,m){
-      map[m] = importsMap
-      return map
-    },{})
-  })
   </script>
-  <script>
-  require(['react','react-dom'].concat(${JSON.stringify(data.imports.slice(0, 2))}),function(React,ReactDOM,data,exports){
-    var Render = exports && exports.View || exports.default || exports
-    ReactDOM.render(
-      React.createElement( Render, data ),
-      document.getElementById('app')
-    )
-  })
-  </script>
 </body>
@@ -45,0 +30,0 @@ </html>

package.json

 {
   "name": "express-tsx",
-  "version": "3.0.31",
+  "version": "3.0.32",
   "description": "express view tsx render",
   "main": "lib/index.js",
+  "types": "src/index.ts",  
   "dependencies": {
     "chokidar": "^1.7.0",
     "config-extend": "^0.1.1",
-    "etag": "^1.8.0",
-    "lodash": "^4.17.4",
-    "mkdirp": "^0.5.1"
+    "lodash": "^4.17.4"
   },
@@ -46,3 +45,2 @@ "peerDependencies": {
   ],
-  "types": "src/index.ts",
   "keywords": [
@@ -49,0 +47,0 @@ "express",

src/Render.ts

 
 import configExtend = require('config-extend')
 
+import { Response,Request } from 'express'
+import { ServerResponse } from "spdy";
 export type ssrRender = (render:any,data:Object)=>string
-export type ssrWrap = (body:string,file:string,data:any)=>string
+export type ssrWrap = (body:string,ViewData:config,file:string,data:config)=>string
 import { wrap as _ssrWrap } from "./ssrWrap";
@@ -24,2 +26,15 @@ export class Options {
 export let defaultOptions = new Options()
+export let filterKeys = ['_locals','settings','cache','req','res']
+export let getViewData = (data:Object)=>
+Object.keys(data).filter(key=>filterKeys.indexOf(key)===-1)
+.reduce((target,key)=>(target[key]=data[key],target),{})
+export class config {
+  constructor(data:config){
+    configExtend(this,data)
+  }
+  title = 'express-tsx'
+  lang = 'en'
+  req:Request
+  res:Response & ServerResponse
+}
 
@@ -29,12 +44,29 @@ export function Render(options?:Options){
       configExtend({},defaultOptions,options,)
-  return function render(file:string,data:Object,send:(error:Error,body:string,)=>void){
+  return function render(file:string,data:config,send:(error:Error,body:string,)=>void){
     let err:Error = null
     let body:string = placeholder
+    let req = data.req
+    let res = data.res
     try{
-      if(ssr){
-        let exports = require(file)
-        let render = exports && exports.View || exports.default || exports
-        body = ssrRender( render, data, )
+      let ViewData:any = getViewData(data)
+      let callback = req.query.callback
+      switch(true){
+      case typeof callback === 'string':
+        body = JSON.stringify(ViewData)
+        if(callback.length){
+          res.type('js')
+          body = `typeof ${callback} === 'function' && ${callback}(${body})`
+        }else{
+          res.type('json')
+        }
+        break
+      default:
+        if(ssr){
+          let exports = require(file)
+          let render = exports && exports.View || exports.default || exports
+          body = ssrRender( render, ViewData, )
+        }
+        body = ssrWrap( body, ViewData, file, data )
+        break
       }
-      body = ssrWrap( body, file, data, )
     }
@@ -45,3 +77,3 @@ catch(e){
     finally{
-        send(err,body)
+      send(err,body)
     }
@@ -48,0 +80,0 @@ }

src/ssrWrap/Compile/Compile.ts

@@ -6,3 +6,2 @@ import ts = require('typescript')
 import chokidar = require('chokidar')
-import mkdirp = require('mkdirp')
 
@@ -63,5 +62,2 @@ export let defaultCompilerOptions:ts.CompilerOptions = {
         let shot = target[filename] = new Shot(filename)
-        // for(let key in target){
-        //   target[key].expired = true
-        // }
       }
@@ -68,0 +64,0 @@ return target[filename]

src/ssrWrap/middleware.ts

@@ -6,39 +6,16 @@ import { Router,Response,Request } from "express";
 import configExtend = require('config-extend')
-export class config {
-  constructor(data:config){
-    configExtend(this,data)
-  }
-  //pre set
-  req:Request
-  res:Response & ServerResponse
-  //placeholder
-  title = 'express-tsx'
-  lang = 'en'
-  imports:string[]
-  baseUrl:string
-  //don't need show
-  _locals:any
-}
 declare module 'http' {
   interface ServerResponse {
-    ViewData:{[key:string]:any}
+    res:ServerResponse & Response
+    req:Request
   }
 }
+export let extname_use_express_tsx = ['.tsx']
 middleware.use(function(req,res,next){
-  let originRender = res.render
+  res.locals.res = res
   res.locals.req = req
-  res.locals.res = res
-  res.render = function(file:string,data={},){
-    if(req.query.callback === 'define'){
-      res.jsonp(data)
-    }else{
-      res.ViewData = Object.assign({},data)
-      originRender.apply(this,arguments)
-    }
-    return this
-  }
   next()
 })
 export const basePath = '/express-tsx'
-export const MaxAge = 60*60*12
+export let maxAge = 60*60*12
 import { etag } from "./push";
@@ -48,3 +25,3 @@ import { parse } from "url";
   res.type('js')
-  res.setHeader('cache-control','max-age='+MaxAge)
+  res.setHeader('cache-control','max-age='+maxAge)
   let module = decodeURI(parse(req.url).pathname).slice(1)
@@ -51,0 +28,0 @@ module = module.replace(/\.(js|tsx|ts|jsx)$/,'')

src/ssrWrap/push.ts

@@ -6,3 +6,3 @@ import { compile } from "./Compile";
 import { difference } from "lodash";
-import { MaxAge } from "./middleware";
+import { maxAge } from "./middleware";
 export const contentType = {
@@ -14,3 +14,3 @@ request:{
     'content-type'    :'application/javascript',
-    'Cache-Control'   :'max-age='+MaxAge,
+    'Cache-Control'   :'max-age='+maxAge,
   }
@@ -27,10 +27,14 @@ }
 }
-import { config,basePath } from "./middleware";
+import { basePath } from "./middleware";
 import configExtend = require('config-extend')
 export let etag = (module)=>compile.getScriptVersion(module)
 export let ssrEtag = module=>module+'?v='+etag(module)
-export let push = (file,data:config)=>{
-  data = new config(data)
+import { Response,Request } from "express";
+import { config } from "../";
+import { bowerRenderScript } from "./ssrWrap";
+import { requirejsConfigPath } from "./requirejs";
+export let push = function push(body:string, ViewData:config, file:string,data:config){
   let req = data.req
   let res = data.res
+  //make dataurl
   let url = parse(req.originalUrl)
@@ -40,22 +44,29 @@ url.search = url.search || ''
   let dataurl = format(url)
-  let imports = compile.getImports(file)
+  //get imports
+  let imports = compile.getImports(file).concat([requirejsConfigPath,bowerRenderScript])
+  //get need preload_imports
   res.setHeader('ETag',encodeURI(imports.map(ssrEtag).join(';')))
   let preloaded = decodeURI((req.header('if-none-match') || '')).split(';')
   let preload_imports = difference(imports.map(ssrEtag),preloaded).map(m=>m.split('?')[0])
-  // debugger
   let relativePath = join(req.app.path(),basePath).replace(/\\/g,'/')
+  /**map module to absolute url */ 
   let pushEtag = module=>encodeURI(`${relativePath}/${module.replace(/\.(tsx|ts|js|jsx)$/,'')}?v=${etag(module)}`)
   let preload_imports_path = preload_imports.map(pushEtag)
-  if(res.push){// http2 push
-    res.push(dataurl,dataContentType).end(`define(${JSON.stringify(res.ViewData)})`)
+  // http2 push
+  if(res.push){
+    res.push(dataurl,dataContentType).end(`define(${JSON.stringify(ViewData)})`)
     preload_imports.forEach((module,index)=>{
       let modulePath = preload_imports_path[index]
       let body = compile.compile(module).outputFiles[0].text
-      res.push(modulePath,configExtend({ response:{ ETag:etag(body) } },contentType)).end(body)
+      res.push(modulePath,configExtend({ response:{ ETag:etag(module) } },contentType)).end(body)
       return modulePath
     })
   }
-  data.imports = [dataurl].concat(imports.map(pushEtag))
+  //preload
   res.setHeader('Link',[dataurl].concat(preload_imports_path).map(path=>`<${path}>; rel=preload; as=script`).join(','))
-  return data
+  //return  dataurl and imports
+  return {
+    imports:[dataurl].concat(imports.map(pushEtag)),
+    pushEtag,
+  }
 }

src/ssrWrap/requirejs.ts

@@ -12,7 +12,13 @@ import configExtend = require('config-extend')
 }
-export let requirejsScript:string
-export let requirejsConfig = (requirejsConfig?:RequireConfig)=>{
+import fs = require('fs')
+import { compile } from "./Compile";
+export let requirejsConfigPath = compile.files[require.resolve('./_requirejs.config')].filename
+export let requirejsConfig = (requirejsConfig?:RequireConfig)=>new Promise((resolve,reject)=>{
   configExtend(requirejs,requirejsConfig)
-  requirejsScript = 'var requirejs='+JSON.stringify(requirejs)
-}
+  fs.writeFileSync(
+    requirejsConfigPath,
+    'var requirejs='+JSON.stringify(requirejs),
+    // (err)=>err?reject(err):resolve(requirejsConfigPath)
+  )
+})
 requirejsConfig() // init , create requirejsBuffer

src/ssrWrap/ssrWrap.ts

 
-import { config } from "./middleware";
-import { requirejsScript,requirejs } from './requirejs'
+import { requirejsConfigPath,requirejs } from './requirejs'
 import { ssrWrap } from './'
+import configExtend = require('config-extend')
+import { config } from "../";
 import { push } from "./push";
-export const wrap:ssrWrap = ( body, file, data:config, )=>{
-  data = push(file,data)
+import { compile } from "./Compile";
+export let bowerRenderScript = compile.files[require.resolve('./bowerRender')].filename
+export const wrap:ssrWrap = function( body, ViewData, file, data  ){
+    ViewData = new config(ViewData)
+let { imports, pushEtag } = push( body, ViewData, file,data)
+let [ requirejsConfigPath,bowerRenderScript ] = imports.slice(-2)
 return `
 <!DOCTYPE html>
-<html lang="${ data.lang }">
+<html lang="${ ViewData.lang }">
 <head>
@@ -15,31 +20,11 @@ <meta charset="UTF-8"/>
 <meta http-equiv="X-UA-Compatible" content="ie=edge"/>
-<title>${ data.title }</title>
+<title>${ ViewData.title }</title>
 </head>
 <body>
   <div id="app">${ body }</div>
-  <script>${requirejsScript}</script>
+  <script src="${requirejsConfigPath}"></script>
   <script src="${requirejs.paths['requirejs']}.js"></script>
+  <script src="${bowerRenderScript}">${JSON.stringify(imports)}</script>
   <script>
-  var imports = ${JSON.stringify(data.imports)}.slice(1)
-  var importsMap = imports.reduce(function(map,module_and_version){
-    var module = module_and_version.split('?')[0]
-        map[module] = module_and_version
-    return map
-  },{})
-  requirejs.config({
-    map:imports.reduce(function(map,m){
-      map[m] = importsMap
-      return map
-    },{})
-  })
   </script>
-  <script>
-  require(['react','react-dom'].concat(${JSON.stringify(data.imports.slice(0,2))}),function(React,ReactDOM,data,exports){
-    var Render = exports && exports.View || exports.default || exports
-    ReactDOM.render(
-      React.createElement( Render, data ),
-      document.getElementById('app')
-    )
-  })
-  </script>
 </body>
@@ -46,0 +31,0 @@ </html>

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

45525

increased by16.34%

Dependency count

7

decreased by-22.22%

Number of package files

37

increased by19.35%

Lines of code

717

increased by8.14%

Worsened metrics

Number of low supply chain risk alerts

3

increased by50%

Dependency changes

• - Removedetag@^1.8.0

• - Removedmkdirp@^0.5.1

• - Removedminimist@1.2.8(transitive)

• - Removedmkdirp@0.5.6(transitive)