Angular 与 Domino 的通用：获取“instanceof”的右侧不是一个对象

Question

我正在使用 Angular Universal 和 domino 在 Express 服务器上“伪造”DOM 服务器端。一切都工作正常，直到出现npm cache clean --force，然后出现 anpm install

\n\n

我收到以下错误：

\n\n

/path/to/app/src/gui/dist/server/server.js:2378\n */(s),2))[0],l=i[1]),this.engine.listen(this.namespaceId,a,s,l,function(e){var t=e._data||-1;o.factory.scheduleListenerCallback(t,n,e)})}return this.delegate.listen(e,t,n)},t}(h);var g=function(e){function t(t,n,r){return e.call(this,t.body,n,r)||this}return Object(r.c)(t,e),t=Object(r.b)([Object(i.Injectable)(),Object(r.e)(0,Object(i.Inject)(l.DOCUMENT)),Object(r.d)("design:paramtypes",[Object,s.AnimationDriver,s["\xc9\xb5AnimationStyleNormalizer"]])],t)}(s["\xc9\xb5AnimationEngine"]);function v(){return Object(s["\xc9\xb5supportsWebAnimations"])()?new s["\xc9\xb5WebAnimationsDriver"]:new s["\xc9\xb5CssKeyframesDriver"]}function y(){return new s["\xc9\xb5WebAnimationsStyleNormalizer"]}function b(e,t,n){return new f(e,t,n)}var w=new i.InjectionToken("AnimationModuleType"),_=[{provide:a.AnimationBuilder,useClass:u},{provide:s["\xc9\xb5AnimationStyleNormalizer"],useFactory:y},{provide:s["\xc9\xb5AnimationEngine"],useClass:g},{provide:i.RendererFactory2\n\nTypeError: Right-hand side of \'instanceof\' is not an object\n    at bt (/path/to/app/src/gui/dist/server/server.js:2378:180688)\n    at yt (/path/to/app/src/gui/dist/server/server.js:2378:180563)\n    at ir (/path/to/app/src/gui/dist/server/server.js:2378:203358)\n    at We.insertToken (/path/to/app/src/gui/dist/server/server.js:2378:179949)\n    at /path/to/app/src/gui/dist/server/server.js:2378:183251\n    at kt (/path/to/app/src/gui/dist/server/server.js:2378:183266)\n    at Xe (/path/to/app/src/gui/dist/server/server.js:2378:178211)\n    at Object.parse (/path/to/app/src/gui/dist/server/server.js:2378:177177)\n    at Object.t.createDocument (/path/to/app/src/gui/dist/server/server.js:2833:9750)\n    at Object.t.createWindow (/path/to/app/src/gui/dist/server/server.js:2833:10129)\n

\n\n

错误发生在domino的HTMLParser.js中，第2177行，位于以下几行：

\n\n

doc._appendChild(root);\nstack.push(root);\nif (fragmentContext instanceof impl.HTMLTemplateElement) {\n  templateInsertionModes.push(in_template_mode);\n}\n

\n\n

impl.HTMLTemplateElement实际上是空的。

\n\n

我使用多米诺骨牌声明的 server.ts 片段是：

\n\n

// const domino = require(\'@angular/platform-server/node_modules/domino\');\nconst domino = require(\'domino\');\n\nconst template = fs.readFileSync(path.join(process.cwd(), \'dist\', \'browser\', \'index.html\')).toString();\nconst win = domino.createWindow(template);\nglobal[\'window\'] = win;\nglobal[\'document\'] = win.document;\nglobal[\'DOMTokenList\'] = win.DOMTokenList;\nglobal[\'Node\'] = win.Node;\nglobal[\'Text\'] = win.Text;\nglobal[\'jQuery\'] = {};\n// global[\'$\'] = require(\'jquery\');\n// global[\'window.$\'] = require(\'jquery\');\nglobal[\'HTMLElement\'] = win.HTMLElement;\nglobal[\'Materialize\'] = win.Materialize;\nglobal[\'navigator\'] = win.navigator;\n

\n\n

对这个问题有什么建议吗？

\n

Answer 1

我发现问题的根源在于将“生产”模式设置为 webpack。事实上，出于性能原因，我设置了webpack.server.config.js

module.exports = {
    mode: 'production',
    ...
}

此模式会导致多米诺骨牌出现意外行为。设置mode: 'none'解决了问题。