From 359d00cec97ddbe1fbdb065cccd250808b4db7fa Mon Sep 17 00:00:00 2001 From: Sergey Bolshchikov Date: Sun, 16 Apr 2017 18:55:57 +0300 Subject: [PATCH] convert to angular lazy component --- package.json | 3 ++- src/angular/manifest.js | 17 +++++++++++++++++ src/index.vm | 6 +----- src/react/components/App/index.js | 12 ++++++++++++ 4 files changed, 32 insertions(+), 6 deletions(-) create mode 100644 src/angular/manifest.js diff --git a/package.json b/package.json index d5b7dba..55e0099 100644 --- a/package.json +++ b/package.json @@ -48,7 +48,8 @@ "yoshi": { "entry": { "react-client": "./react/client.js", - "angular-client": "./angular/client.js" + "angular-client": "./angular/client.js", + "angular-manifest": "./angular/manifest.js" } } } diff --git a/src/angular/manifest.js b/src/angular/manifest.js new file mode 100644 index 0000000..f79ec84 --- /dev/null +++ b/src/angular/manifest.js @@ -0,0 +1,17 @@ +import {ModuleRegistry, AngularLazyComponent} from 'react-module-container'; + +class NgMainApp extends AngularLazyComponent { + constructor(props) { + super(props, { + files: [ + `${props.topology.staticsBaseUrl}angular-client.css`, + `${props.topology.staticsBaseUrl}angular-client.bundle.js` + ], + module: 'myApp', + component: 'main-app', + unloadStylesOnDestroy: true + }); + } +} + +ModuleRegistry.registerComponent('angular.main', () => NgMainApp); diff --git a/src/index.vm b/src/index.vm index d5a336b..5988487 100644 --- a/src/index.vm +++ b/src/index.vm @@ -5,22 +5,18 @@ ${title} -
-
- -
+ - \ No newline at end of file diff --git a/src/react/components/App/index.js b/src/react/components/App/index.js index 5bde601..7506d22 100644 --- a/src/react/components/App/index.js +++ b/src/react/components/App/index.js @@ -1,13 +1,25 @@ import React from 'react'; import s from './App.scss'; +import {ModuleRegistry} from 'react-module-container'; class App extends React.Component { + componentWillMount() { + this.setState(() => ({ + AngularComponent: ModuleRegistry.component('angular.main') + })); + } render() { + const AngularComponent = this.state.AngularComponent; + const topology = { + staticsBaseUrl: window.__STATICS_BASE_URL__ + }; + return (

{'Hello React World!'}

+
); }