Web: Applied WP:ModuleFederation best practices
This commit is contained in:
parent
789b547ccf
commit
b9ed789746
@ -4,6 +4,7 @@ import PropTypes from "prop-types";
|
||||
import styled from "styled-components";
|
||||
import NavItem from "./nav-item";
|
||||
import ProfileActions from "./profile-actions";
|
||||
import history from "../../../history";
|
||||
|
||||
import { useTranslation } from "react-i18next";
|
||||
import { tablet } from "@appserver/components/src/utils/device";
|
||||
@ -55,7 +56,7 @@ const HeaderNav = React.memo(
|
||||
}
|
||||
}, []);
|
||||
|
||||
const onAboutClick = useCallback(() => window.open("/about", "_self"), []);
|
||||
const onAboutClick = useCallback(() => history.push("/about"), []);
|
||||
|
||||
const onLogoutClick = useCallback(() => logout && logout(), [logout]);
|
||||
|
||||
|
@ -49,7 +49,7 @@ const initialState = {
|
||||
timezones: [],
|
||||
utcOffset: "00:00:00",
|
||||
utcHoursOffset: 0,
|
||||
defaultPage: "/products/files",
|
||||
defaultPage: "/", //"/products/files",
|
||||
homepage: "", //config.homepage,
|
||||
datePattern: "M/d/yyyy",
|
||||
datePatternJQ: "00/00/0000",
|
||||
|
@ -109,12 +109,7 @@ export { withLayoutSize } from "./withLayoutSize";
|
||||
|
||||
export function tryRedirectTo(page) {
|
||||
if (
|
||||
page &&
|
||||
page !== "" &&
|
||||
page !== "/" &&
|
||||
window.location &&
|
||||
window.location.pathname &&
|
||||
window.location.pathname === page &&
|
||||
window.location.pathname === page ||
|
||||
window.location.pathname.indexOf(page) !== -1
|
||||
) {
|
||||
return false;
|
||||
|
@ -3,23 +3,20 @@
|
||||
"version": "0.1.0",
|
||||
"private": "true",
|
||||
"scripts": {
|
||||
"start": "webpack-cli serve",
|
||||
"build": "webpack --mode production",
|
||||
"build:dev": "webpack --mode development",
|
||||
"build:start": "cd dist && PORT=5008 npx serve",
|
||||
"start": "webpack-dev-server --mode development",
|
||||
"start:live": "webpack-dev-server --open --mode development --liveReload",
|
||||
"docker:build": "docker build . -t files",
|
||||
"docker:run": "docker run -p 5008:5008 files"
|
||||
"serve": "serve dist -p 5008",
|
||||
"clean": "rm -rf dist"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@babel/core": "7.9.6",
|
||||
"@babel/core": "7.12.10",
|
||||
"@babel/plugin-proposal-class-properties": "^7.12.1",
|
||||
"@babel/plugin-proposal-export-default-from": "^7.12.1",
|
||||
"@babel/plugin-transform-runtime": "^7.12.1",
|
||||
"@babel/preset-env": "^7.12.7",
|
||||
"@babel/preset-react": "7.9.4",
|
||||
"@babel/preset-react": "7.12.10",
|
||||
"@svgr/webpack": "^5.5.0",
|
||||
"babel-loader": "8.1.0",
|
||||
"babel-loader": "8.2.2",
|
||||
"css-loader": "^3.6.0",
|
||||
"html-webpack-plugin": "4.5.0",
|
||||
"i18next": "^19.8.4",
|
||||
@ -27,14 +24,13 @@
|
||||
"react-i18next": "^11.7.3",
|
||||
"source-map-loader": "^1.1.2",
|
||||
"style-loader": "1.2.1",
|
||||
"webpack": "5.0.0",
|
||||
"webpack-cli": "3.3.11",
|
||||
"webpack-dev-server": "3.11.0"
|
||||
"webpack": "5.14.0",
|
||||
"webpack-cli": "4.3.1",
|
||||
"webpack-dev-server": "3.11.2",
|
||||
"serve": "11.3.2"
|
||||
},
|
||||
"dependencies": {
|
||||
"@babel/runtime": "^7.12.5",
|
||||
"@redux-dynostore/core": "^3.1.1",
|
||||
"@redux-dynostore/react-redux": "^3.1.1",
|
||||
"attr-accept": "^2.2.2",
|
||||
"axios": "^0.21.0",
|
||||
"email-addresses": "^3.1.0",
|
||||
|
@ -1,233 +1,247 @@
|
||||
import React, { Suspense } from "react";
|
||||
import { connect } from "react-redux";
|
||||
import { Router, Switch, Redirect, Route } from "react-router-dom";
|
||||
import Home from "./components/pages/Home";
|
||||
import DocEditor from "./components/pages/DocEditor";
|
||||
import Settings from "./components/pages/Settings";
|
||||
import VersionHistory from "./components/pages/VersionHistory";
|
||||
import { fetchTreeFolders } from "./store/files/actions";
|
||||
import config from "../package.json";
|
||||
import { Provider } from "react-redux";
|
||||
import store from "studio/store";
|
||||
import Shell from "studio/shell";
|
||||
|
||||
import {
|
||||
store as commonStore,
|
||||
history,
|
||||
PrivateRoute,
|
||||
PublicRoute,
|
||||
Login,
|
||||
Error404,
|
||||
Error520,
|
||||
Offline,
|
||||
NavMenu,
|
||||
Main,
|
||||
utils,
|
||||
toastr,
|
||||
Layout,
|
||||
regDesktop,
|
||||
} from "@appserver/common";
|
||||
import "./custom.scss";
|
||||
|
||||
const {
|
||||
setIsLoaded,
|
||||
getUser,
|
||||
getPortalSettings,
|
||||
getModules,
|
||||
setCurrentProductId,
|
||||
setCurrentProductHomePage,
|
||||
getPortalCultures,
|
||||
setEncryptionKeys,
|
||||
getIsEncryptionSupport,
|
||||
getEncryptionKeys,
|
||||
getIsAuthenticated,
|
||||
} = commonStore.auth.actions;
|
||||
const {
|
||||
getCurrentUser,
|
||||
isEncryptionSupport,
|
||||
isDesktopClient,
|
||||
getIsLoaded,
|
||||
} = commonStore.auth.selectors;
|
||||
const App = () => (
|
||||
<Provider store={store}>
|
||||
<Shell />
|
||||
</Provider>
|
||||
);
|
||||
|
||||
class App extends React.Component {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
export default App;
|
||||
|
||||
const pathname = window.location.pathname.toLowerCase();
|
||||
this.isEditor = pathname.indexOf("doceditor") !== -1;
|
||||
this.isDesktopInit = false;
|
||||
}
|
||||
// import React, { Suspense } from "react";
|
||||
// import { connect } from "react-redux";
|
||||
// import { Router, Switch, Redirect, Route } from "react-router-dom";
|
||||
// import Home from "./components/pages/Home";
|
||||
// import DocEditor from "./components/pages/DocEditor";
|
||||
// import Settings from "./components/pages/Settings";
|
||||
// import VersionHistory from "./components/pages/VersionHistory";
|
||||
// import { fetchTreeFolders } from "./store/files/actions";
|
||||
// import config from "../package.json";
|
||||
|
||||
componentDidMount() {
|
||||
const {
|
||||
setModuleInfo,
|
||||
getUser,
|
||||
getPortalSettings,
|
||||
getModules,
|
||||
getPortalCultures,
|
||||
fetchTreeFolders,
|
||||
setIsLoaded,
|
||||
getIsEncryptionSupport,
|
||||
getEncryptionKeys,
|
||||
isDesktop,
|
||||
getIsAuthenticated,
|
||||
} = this.props;
|
||||
// import {
|
||||
// store as commonStore,
|
||||
// history,
|
||||
// PrivateRoute,
|
||||
// PublicRoute,
|
||||
// Login,
|
||||
// Error404,
|
||||
// Error520,
|
||||
// Offline,
|
||||
// NavMenu,
|
||||
// Main,
|
||||
// utils,
|
||||
// toastr,
|
||||
// Layout,
|
||||
// regDesktop,
|
||||
// } from "@appserver/common";
|
||||
|
||||
setModuleInfo();
|
||||
// const {
|
||||
// setIsLoaded,
|
||||
// getUser,
|
||||
// getPortalSettings,
|
||||
// getModules,
|
||||
// setCurrentProductId,
|
||||
// setCurrentProductHomePage,
|
||||
// getPortalCultures,
|
||||
// setEncryptionKeys,
|
||||
// getIsEncryptionSupport,
|
||||
// getEncryptionKeys,
|
||||
// getIsAuthenticated,
|
||||
// } = commonStore.auth.actions;
|
||||
// const {
|
||||
// getCurrentUser,
|
||||
// isEncryptionSupport,
|
||||
// isDesktopClient,
|
||||
// getIsLoaded,
|
||||
// } = commonStore.auth.selectors;
|
||||
|
||||
if (this.isEditor) {
|
||||
setIsLoaded();
|
||||
return;
|
||||
}
|
||||
// class App extends React.Component {
|
||||
// constructor(props) {
|
||||
// super(props);
|
||||
|
||||
getIsAuthenticated().then((isAuthenticated) => {
|
||||
if (!isAuthenticated) {
|
||||
utils.updateTempContent();
|
||||
return setIsLoaded();
|
||||
} else {
|
||||
utils.updateTempContent(isAuthenticated);
|
||||
}
|
||||
// const pathname = window.location.pathname.toLowerCase();
|
||||
// this.isEditor = pathname.indexOf("doceditor") !== -1;
|
||||
// this.isDesktopInit = false;
|
||||
// }
|
||||
|
||||
const requests = [getUser()];
|
||||
if (!this.isEditor) {
|
||||
requests.push(
|
||||
getPortalSettings(),
|
||||
getModules(),
|
||||
getPortalCultures(),
|
||||
fetchTreeFolders()
|
||||
);
|
||||
if (isDesktop) {
|
||||
requests.push(getIsEncryptionSupport(), getEncryptionKeys());
|
||||
}
|
||||
}
|
||||
// componentDidMount() {
|
||||
// const {
|
||||
// setModuleInfo,
|
||||
// getUser,
|
||||
// getPortalSettings,
|
||||
// getModules,
|
||||
// getPortalCultures,
|
||||
// fetchTreeFolders,
|
||||
// setIsLoaded,
|
||||
// getIsEncryptionSupport,
|
||||
// getEncryptionKeys,
|
||||
// isDesktop,
|
||||
// getIsAuthenticated,
|
||||
// } = this.props;
|
||||
|
||||
Promise.all(requests)
|
||||
.then(() => {
|
||||
if (this.isEditor) return Promise.resolve();
|
||||
})
|
||||
.catch((e) => {
|
||||
toastr.error(e);
|
||||
})
|
||||
.finally(() => {
|
||||
utils.updateTempContent();
|
||||
setIsLoaded();
|
||||
});
|
||||
});
|
||||
}
|
||||
// setModuleInfo();
|
||||
|
||||
componentDidUpdate(prevProps) {
|
||||
const {
|
||||
isAuthenticated,
|
||||
user,
|
||||
isEncryption,
|
||||
encryptionKeys,
|
||||
setEncryptionKeys,
|
||||
isLoaded,
|
||||
} = this.props;
|
||||
console.log("componentDidUpdate: ", this.props);
|
||||
if (isAuthenticated && !this.isDesktopInit && isEncryption && isLoaded) {
|
||||
this.isDesktopInit = true;
|
||||
regDesktop(
|
||||
user,
|
||||
isEncryption,
|
||||
encryptionKeys,
|
||||
setEncryptionKeys,
|
||||
this.isEditor
|
||||
);
|
||||
console.log(
|
||||
"%c%s",
|
||||
"color: green; font: 1.2em bold;",
|
||||
"Current keys is: ",
|
||||
encryptionKeys
|
||||
);
|
||||
}
|
||||
}
|
||||
// if (this.isEditor) {
|
||||
// setIsLoaded();
|
||||
// return;
|
||||
// }
|
||||
|
||||
render() {
|
||||
const { homepage, isDesktop } = this.props;
|
||||
console.log(Layout);
|
||||
// getIsAuthenticated().then((isAuthenticated) => {
|
||||
// if (!isAuthenticated) {
|
||||
// utils.updateTempContent();
|
||||
// return setIsLoaded();
|
||||
// } else {
|
||||
// utils.updateTempContent(isAuthenticated);
|
||||
// }
|
||||
|
||||
return navigator.onLine ? (
|
||||
<Layout>
|
||||
<Router history={history}>
|
||||
{!this.isEditor && <NavMenu />}
|
||||
<Main isDesktop={isDesktop}>
|
||||
<Suspense fallback={null}>
|
||||
<Switch>
|
||||
<Redirect exact from="/" to={`${homepage}`} />
|
||||
<PrivateRoute
|
||||
exact
|
||||
path={`${homepage}/settings/:setting`}
|
||||
component={Settings}
|
||||
/>
|
||||
<Route
|
||||
exact
|
||||
path={[
|
||||
`${homepage}/doceditor`,
|
||||
`/Products/Files/DocEditor.aspx`,
|
||||
]}
|
||||
component={DocEditor}
|
||||
/>
|
||||
<PrivateRoute
|
||||
exact
|
||||
path={`${homepage}/:fileId/history`}
|
||||
component={VersionHistory}
|
||||
/>
|
||||
<PrivateRoute exact path={homepage} component={Home} />
|
||||
<PrivateRoute path={`${homepage}/filter`} component={Home} />
|
||||
<PublicRoute
|
||||
exact
|
||||
path={[
|
||||
"/login",
|
||||
"/login/error=:error",
|
||||
"/login/confirmed-email=:confirmedEmail",
|
||||
]}
|
||||
component={Login}
|
||||
/>
|
||||
<PrivateRoute
|
||||
exact
|
||||
path={`/error=:error`}
|
||||
component={Error520}
|
||||
/>
|
||||
<PrivateRoute component={Error404} />
|
||||
</Switch>
|
||||
</Suspense>
|
||||
</Main>
|
||||
</Router>
|
||||
</Layout>
|
||||
) : (
|
||||
<Offline />
|
||||
);
|
||||
}
|
||||
}
|
||||
// const requests = [getUser()];
|
||||
// if (!this.isEditor) {
|
||||
// requests.push(
|
||||
// getPortalSettings(),
|
||||
// getModules(),
|
||||
// getPortalCultures(),
|
||||
// fetchTreeFolders()
|
||||
// );
|
||||
// if (isDesktop) {
|
||||
// requests.push(getIsEncryptionSupport(), getEncryptionKeys());
|
||||
// }
|
||||
// }
|
||||
|
||||
const mapStateToProps = (state) => {
|
||||
const { settings } = state.auth;
|
||||
const { homepage } = settings;
|
||||
return {
|
||||
homepage: homepage || config.homepage,
|
||||
user: getCurrentUser(state),
|
||||
isAuthenticated: state.auth.isAuthenticated,
|
||||
isLoaded: getIsLoaded(state),
|
||||
isEncryption: isEncryptionSupport(state),
|
||||
isDesktop: isDesktopClient(state),
|
||||
encryptionKeys: settings.encryptionKeys,
|
||||
};
|
||||
};
|
||||
// Promise.all(requests)
|
||||
// .then(() => {
|
||||
// if (this.isEditor) return Promise.resolve();
|
||||
// })
|
||||
// .catch((e) => {
|
||||
// toastr.error(e);
|
||||
// })
|
||||
// .finally(() => {
|
||||
// utils.updateTempContent();
|
||||
// setIsLoaded();
|
||||
// });
|
||||
// });
|
||||
// }
|
||||
|
||||
const mapDispatchToProps = (dispatch) => {
|
||||
return {
|
||||
getIsAuthenticated: () => getIsAuthenticated(dispatch),
|
||||
setModuleInfo: () => {
|
||||
dispatch(setCurrentProductHomePage(config.homepage));
|
||||
dispatch(setCurrentProductId("e67be73d-f9ae-4ce1-8fec-1880cb518cb4"));
|
||||
},
|
||||
getUser: () => getUser(dispatch),
|
||||
getPortalSettings: () => getPortalSettings(dispatch),
|
||||
getModules: () => getModules(dispatch),
|
||||
getPortalCultures: () => getPortalCultures(dispatch),
|
||||
fetchTreeFolders: () => dispatch(fetchTreeFolders()),
|
||||
setIsLoaded: () => dispatch(setIsLoaded(true)),
|
||||
getIsEncryptionSupport: () => getIsEncryptionSupport(dispatch),
|
||||
getEncryptionKeys: () => getEncryptionKeys(dispatch),
|
||||
setEncryptionKeys: (keys) => dispatch(setEncryptionKeys(keys)),
|
||||
};
|
||||
};
|
||||
// componentDidUpdate(prevProps) {
|
||||
// const {
|
||||
// isAuthenticated,
|
||||
// user,
|
||||
// isEncryption,
|
||||
// encryptionKeys,
|
||||
// setEncryptionKeys,
|
||||
// isLoaded,
|
||||
// } = this.props;
|
||||
// console.log("componentDidUpdate: ", this.props);
|
||||
// if (isAuthenticated && !this.isDesktopInit && isEncryption && isLoaded) {
|
||||
// this.isDesktopInit = true;
|
||||
// regDesktop(
|
||||
// user,
|
||||
// isEncryption,
|
||||
// encryptionKeys,
|
||||
// setEncryptionKeys,
|
||||
// this.isEditor
|
||||
// );
|
||||
// console.log(
|
||||
// "%c%s",
|
||||
// "color: green; font: 1.2em bold;",
|
||||
// "Current keys is: ",
|
||||
// encryptionKeys
|
||||
// );
|
||||
// }
|
||||
// }
|
||||
|
||||
export default connect(mapStateToProps, mapDispatchToProps)(App);
|
||||
// render() {
|
||||
// const { homepage, isDesktop } = this.props;
|
||||
// console.log(Layout);
|
||||
|
||||
// return navigator.onLine ? (
|
||||
// <Layout>
|
||||
// <Router history={history}>
|
||||
// {!this.isEditor && <NavMenu />}
|
||||
// <Main isDesktop={isDesktop}>
|
||||
// <Suspense fallback={null}>
|
||||
// <Switch>
|
||||
// <Redirect exact from="/" to={`${homepage}`} />
|
||||
// <PrivateRoute
|
||||
// exact
|
||||
// path={`${homepage}/settings/:setting`}
|
||||
// component={Settings}
|
||||
// />
|
||||
// <Route
|
||||
// exact
|
||||
// path={[
|
||||
// `${homepage}/doceditor`,
|
||||
// `/Products/Files/DocEditor.aspx`,
|
||||
// ]}
|
||||
// component={DocEditor}
|
||||
// />
|
||||
// <PrivateRoute
|
||||
// exact
|
||||
// path={`${homepage}/:fileId/history`}
|
||||
// component={VersionHistory}
|
||||
// />
|
||||
// <PrivateRoute exact path={homepage} component={Home} />
|
||||
// <PrivateRoute path={`${homepage}/filter`} component={Home} />
|
||||
// <PublicRoute
|
||||
// exact
|
||||
// path={[
|
||||
// "/login",
|
||||
// "/login/error=:error",
|
||||
// "/login/confirmed-email=:confirmedEmail",
|
||||
// ]}
|
||||
// component={Login}
|
||||
// />
|
||||
// <PrivateRoute
|
||||
// exact
|
||||
// path={`/error=:error`}
|
||||
// component={Error520}
|
||||
// />
|
||||
// <PrivateRoute component={Error404} />
|
||||
// </Switch>
|
||||
// </Suspense>
|
||||
// </Main>
|
||||
// </Router>
|
||||
// </Layout>
|
||||
// ) : (
|
||||
// <Offline />
|
||||
// );
|
||||
// }
|
||||
// }
|
||||
|
||||
// const mapStateToProps = (state) => {
|
||||
// const { settings } = state.auth;
|
||||
// const { homepage } = settings;
|
||||
// return {
|
||||
// homepage: homepage || config.homepage,
|
||||
// user: getCurrentUser(state),
|
||||
// isAuthenticated: state.auth.isAuthenticated,
|
||||
// isLoaded: getIsLoaded(state),
|
||||
// isEncryption: isEncryptionSupport(state),
|
||||
// isDesktop: isDesktopClient(state),
|
||||
// encryptionKeys: settings.encryptionKeys,
|
||||
// };
|
||||
// };
|
||||
|
||||
// const mapDispatchToProps = (dispatch) => {
|
||||
// return {
|
||||
// getIsAuthenticated: () => getIsAuthenticated(dispatch),
|
||||
// setModuleInfo: () => {
|
||||
// dispatch(setCurrentProductHomePage(config.homepage));
|
||||
// dispatch(setCurrentProductId("e67be73d-f9ae-4ce1-8fec-1880cb518cb4"));
|
||||
// },
|
||||
// getUser: () => getUser(dispatch),
|
||||
// getPortalSettings: () => getPortalSettings(dispatch),
|
||||
// getModules: () => getModules(dispatch),
|
||||
// getPortalCultures: () => getPortalCultures(dispatch),
|
||||
// fetchTreeFolders: () => dispatch(fetchTreeFolders()),
|
||||
// setIsLoaded: () => dispatch(setIsLoaded(true)),
|
||||
// getIsEncryptionSupport: () => getIsEncryptionSupport(dispatch),
|
||||
// getEncryptionKeys: () => getEncryptionKeys(dispatch),
|
||||
// setEncryptionKeys: (keys) => dispatch(setEncryptionKeys(keys)),
|
||||
// };
|
||||
// };
|
||||
|
||||
// export default connect(mapStateToProps, mapDispatchToProps)(App);
|
||||
|
@ -1,11 +1,11 @@
|
||||
import React, { useEffect } from "react";
|
||||
import { useStore } from "react-redux";
|
||||
import dynamic from "@redux-dynostore/react-redux";
|
||||
import { attachReducer } from "@redux-dynostore/core";
|
||||
// import { useStore } from "react-redux";
|
||||
// import dynamic from "@redux-dynostore/react-redux";
|
||||
// import { attachReducer } from "@redux-dynostore/core";
|
||||
//import rootReducer from "./store/rootReducer";
|
||||
//import portalReducer from "./store/portal/reducers";
|
||||
const FilesContent = (props) => {
|
||||
const store = useStore();
|
||||
//const store = useStore();
|
||||
|
||||
// useEffect(() => {
|
||||
// console.log("Store object", store);
|
@ -1,13 +0,0 @@
|
||||
import { Provider } from "react-redux";
|
||||
import store from "studio/store";
|
||||
import Frame from "studio/frame";
|
||||
|
||||
import "./custom.scss";
|
||||
|
||||
const FilesPage = () => (
|
||||
<Provider store={store}>
|
||||
<Frame page="files" />
|
||||
</Provider>
|
||||
);
|
||||
|
||||
ReactDOM.render(<FilesPage />, document.getElementById("root"));
|
5
products/ASC.Files/Client/src/bootstrap.js
vendored
Normal file
5
products/ASC.Files/Client/src/bootstrap.js
vendored
Normal file
@ -0,0 +1,5 @@
|
||||
import App from "./App";
|
||||
import React from "react";
|
||||
import ReactDOM from "react-dom";
|
||||
|
||||
ReactDOM.render(<App />, document.getElementById("root"));
|
@ -1,4 +1,4 @@
|
||||
import("./FilesPage");
|
||||
import("./bootstrap");
|
||||
|
||||
//import "./wdyr";
|
||||
|
||||
|
@ -1,13 +1,24 @@
|
||||
const HtmlWebPackPlugin = require("html-webpack-plugin");
|
||||
const ModuleFederationPlugin = require("webpack/lib/container/ModuleFederationPlugin");
|
||||
const HtmlWebpackPlugin = require("html-webpack-plugin");
|
||||
const ModuleFederationPlugin = require("webpack").container
|
||||
.ModuleFederationPlugin;
|
||||
const path = require("path");
|
||||
|
||||
const deps = require("./package.json").dependencies;
|
||||
|
||||
module.exports = {
|
||||
entry: "./src/index",
|
||||
mode: "development",
|
||||
devServer: {
|
||||
contentBase: [path.join(__dirname, "public"), path.join(__dirname, "dist")],
|
||||
contentBasePublicPath: "/products/files/",
|
||||
port: 5008,
|
||||
historyApiFallback: true,
|
||||
hot: false,
|
||||
hotOnly: false,
|
||||
},
|
||||
|
||||
output: {
|
||||
publicPath: "http://localhost:5008/",
|
||||
filename: "bundle.js",
|
||||
path: path.resolve(__dirname, "dist"),
|
||||
publicPath: "auto",
|
||||
chunkFilename: "[id].[contenthash].js",
|
||||
},
|
||||
|
||||
resolve: {
|
||||
@ -17,12 +28,6 @@ module.exports = {
|
||||
},
|
||||
},
|
||||
|
||||
devServer: {
|
||||
port: 5008,
|
||||
contentBase: path.join(__dirname, "public"),
|
||||
contentBasePublicPath: "/products/files/",
|
||||
},
|
||||
|
||||
module: {
|
||||
rules: [
|
||||
{
|
||||
@ -79,10 +84,9 @@ module.exports = {
|
||||
filename: "remoteEntry.js",
|
||||
remotes: {
|
||||
studio: "studio@http://localhost:5001/remoteEntry.js",
|
||||
files: "files@http://localhost:5008/remoteEntry.js",
|
||||
},
|
||||
exposes: {
|
||||
"./page": "./src/FilesContent.jsx",
|
||||
"./page": "./src/Files.jsx",
|
||||
},
|
||||
shared: {
|
||||
...deps,
|
||||
@ -96,7 +100,7 @@ module.exports = {
|
||||
},
|
||||
},
|
||||
}),
|
||||
new HtmlWebPackPlugin({
|
||||
new HtmlWebpackPlugin({
|
||||
template: "./public/index.html",
|
||||
}),
|
||||
],
|
||||
|
@ -3,23 +3,20 @@
|
||||
"version": "0.1.0",
|
||||
"private": "true",
|
||||
"scripts": {
|
||||
"start": "webpack-cli serve",
|
||||
"build": "webpack --mode production",
|
||||
"build:dev": "webpack --mode development",
|
||||
"build:start": "cd dist && PORT=5001 npx serve",
|
||||
"start": "webpack-dev-server --mode development",
|
||||
"start:live": "webpack-dev-server --open --mode development --liveReload",
|
||||
"docker:build": "docker build . -t login",
|
||||
"docker:run": "docker run -p 5001:5001 login"
|
||||
"serve": "serve dist -p 5002",
|
||||
"clean": "rm -rf dist"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@babel/core": "7.9.6",
|
||||
"@babel/core": "7.12.10",
|
||||
"@babel/plugin-proposal-class-properties": "^7.12.1",
|
||||
"@babel/plugin-proposal-export-default-from": "^7.12.1",
|
||||
"@babel/plugin-transform-runtime": "^7.12.1",
|
||||
"@babel/preset-env": "^7.12.7",
|
||||
"@babel/preset-react": "7.9.4",
|
||||
"@babel/preset-react": "7.12.10",
|
||||
"@svgr/webpack": "^5.5.0",
|
||||
"babel-loader": "8.1.0",
|
||||
"babel-loader": "8.2.2",
|
||||
"css-loader": "^3.6.0",
|
||||
"html-webpack-plugin": "4.5.0",
|
||||
"i18next": "^19.8.4",
|
||||
@ -27,16 +24,13 @@
|
||||
"react-i18next": "^11.7.3",
|
||||
"source-map-loader": "^1.1.2",
|
||||
"style-loader": "1.2.1",
|
||||
"webpack": "5.0.0",
|
||||
"webpack-cli": "3.3.11",
|
||||
"webpack-dev-server": "3.11.0"
|
||||
"webpack": "5.14.0",
|
||||
"webpack-cli": "4.3.1",
|
||||
"webpack-dev-server": "3.11.2",
|
||||
"serve": "11.3.2"
|
||||
},
|
||||
"dependencies": {
|
||||
"@babel/runtime": "^7.12.5",
|
||||
"@redux-dynostore/core": "^3.1.1",
|
||||
"@redux-dynostore/react-redux": "^3.1.1",
|
||||
"@redux-dynostore/react-redux-subspace": "^3.1.1",
|
||||
"@redux-dynostore/redux-subspace": "^3.1.1",
|
||||
"attr-accept": "^2.2.2",
|
||||
"axios": "^0.21.0",
|
||||
"email-addresses": "^3.1.0",
|
||||
|
@ -1,186 +1,200 @@
|
||||
import React, { Suspense } from "react";
|
||||
import { connect } from "react-redux";
|
||||
import { Router, Switch, Redirect } from "react-router-dom";
|
||||
import Home from "./components/pages/Home";
|
||||
import Profile from "./components/pages/Profile";
|
||||
import ProfileAction from "./components/pages/ProfileAction";
|
||||
import GroupAction from "./components/pages/GroupAction";
|
||||
import Reassign from "./components/pages/Reassign";
|
||||
import {
|
||||
history,
|
||||
PrivateRoute,
|
||||
PublicRoute,
|
||||
Login,
|
||||
Error404,
|
||||
Error520,
|
||||
Offline,
|
||||
utils,
|
||||
store as commonStore,
|
||||
NavMenu,
|
||||
Main,
|
||||
toastr,
|
||||
} from "@appserver/common";
|
||||
import { getFilterByLocation } from "./helpers/converters";
|
||||
import { fetchGroups, fetchPeople } from "./store/people/actions";
|
||||
import config from "../package.json";
|
||||
import { Provider } from "react-redux";
|
||||
import store from "studio/store";
|
||||
import Shell from "studio/shell";
|
||||
|
||||
const {
|
||||
setIsLoaded,
|
||||
getUser,
|
||||
getPortalSettings,
|
||||
getModules,
|
||||
setCurrentProductId,
|
||||
setCurrentProductHomePage,
|
||||
getPortalPasswordSettings,
|
||||
getPortalCultures,
|
||||
getIsAuthenticated,
|
||||
} = commonStore.auth.actions;
|
||||
import "./custom.scss";
|
||||
|
||||
/*const Profile = lazy(() => import("./components/pages/Profile"));
|
||||
const ProfileAction = lazy(() => import("./components/pages/ProfileAction"));
|
||||
const GroupAction = lazy(() => import("./components/pages/GroupAction"));*/
|
||||
const App = () => (
|
||||
<Provider store={store}>
|
||||
<Shell />
|
||||
</Provider>
|
||||
);
|
||||
|
||||
class App extends React.Component {
|
||||
componentDidMount() {
|
||||
const {
|
||||
setModuleInfo,
|
||||
getUser,
|
||||
getPortalSettings,
|
||||
getModules,
|
||||
getPortalPasswordSettings,
|
||||
getPortalCultures,
|
||||
fetchGroups,
|
||||
fetchPeople,
|
||||
setIsLoaded,
|
||||
getIsAuthenticated,
|
||||
} = this.props;
|
||||
export default App;
|
||||
|
||||
setModuleInfo();
|
||||
getIsAuthenticated().then((isAuthenticated) => {
|
||||
if (!isAuthenticated) {
|
||||
utils.updateTempContent();
|
||||
return setIsLoaded();
|
||||
} else {
|
||||
utils.updateTempContent(isAuthenticated);
|
||||
}
|
||||
// import React, { Suspense } from "react";
|
||||
// import { connect } from "react-redux";
|
||||
// import { Router, Switch, Redirect } from "react-router-dom";
|
||||
// import Home from "./components/pages/Home";
|
||||
// import Profile from "./components/pages/Profile";
|
||||
// import ProfileAction from "./components/pages/ProfileAction";
|
||||
// import GroupAction from "./components/pages/GroupAction";
|
||||
// import Reassign from "./components/pages/Reassign";
|
||||
// import {
|
||||
// history,
|
||||
// PrivateRoute,
|
||||
// PublicRoute,
|
||||
// Login,
|
||||
// Error404,
|
||||
// Error520,
|
||||
// Offline,
|
||||
// utils,
|
||||
// store as commonStore,
|
||||
// NavMenu,
|
||||
// Main,
|
||||
// toastr,
|
||||
// } from "@appserver/common";
|
||||
// import { getFilterByLocation } from "./helpers/converters";
|
||||
// import { fetchGroups, fetchPeople } from "./store/people/actions";
|
||||
// import config from "../package.json";
|
||||
|
||||
const requests = [
|
||||
getUser(),
|
||||
getPortalSettings(),
|
||||
getModules(),
|
||||
getPortalPasswordSettings(),
|
||||
getPortalCultures(),
|
||||
fetchGroups(),
|
||||
fetchPeople(),
|
||||
];
|
||||
// const {
|
||||
// setIsLoaded,
|
||||
// getUser,
|
||||
// getPortalSettings,
|
||||
// getModules,
|
||||
// setCurrentProductId,
|
||||
// setCurrentProductHomePage,
|
||||
// getPortalPasswordSettings,
|
||||
// getPortalCultures,
|
||||
// getIsAuthenticated,
|
||||
// } = commonStore.auth.actions;
|
||||
|
||||
Promise.all(requests)
|
||||
.catch((e) => {
|
||||
toastr.error(e);
|
||||
})
|
||||
.finally(() => {
|
||||
utils.updateTempContent();
|
||||
setIsLoaded();
|
||||
});
|
||||
});
|
||||
}
|
||||
// /*const Profile = lazy(() => import("./components/pages/Profile"));
|
||||
// const ProfileAction = lazy(() => import("./components/pages/ProfileAction"));
|
||||
// const GroupAction = lazy(() => import("./components/pages/GroupAction"));*/
|
||||
|
||||
render() {
|
||||
const { homepage } = this.props;
|
||||
console.log("People App render", this.props);
|
||||
return navigator.onLine ? (
|
||||
<Router history={history}>
|
||||
<NavMenu />
|
||||
<Main>
|
||||
<Suspense fallback={null}>
|
||||
<Switch>
|
||||
<Redirect exact from="/" to={`${homepage}`} />
|
||||
<PrivateRoute
|
||||
exact
|
||||
path={`${homepage}/view/:userId`}
|
||||
component={Profile}
|
||||
/>
|
||||
<PrivateRoute
|
||||
path={`${homepage}/edit/:userId`}
|
||||
restricted
|
||||
allowForMe
|
||||
component={ProfileAction}
|
||||
/>
|
||||
<PrivateRoute
|
||||
path={`${homepage}/create/:type`}
|
||||
restricted
|
||||
component={ProfileAction}
|
||||
/>
|
||||
<PrivateRoute
|
||||
path={[
|
||||
`${homepage}/group/edit/:groupId`,
|
||||
`${homepage}/group/create`,
|
||||
]}
|
||||
restricted
|
||||
component={GroupAction}
|
||||
/>
|
||||
<PrivateRoute
|
||||
path={`${homepage}/reassign/:userId`}
|
||||
restricted
|
||||
component={Reassign}
|
||||
/>
|
||||
<PrivateRoute exact path={homepage} component={Home} />
|
||||
<PrivateRoute path={`${homepage}/filter`} component={Home} />
|
||||
<PublicRoute
|
||||
exact
|
||||
path={[
|
||||
"/login",
|
||||
"/login/error=:error",
|
||||
"/login/confirmed-email=:confirmedEmail",
|
||||
]}
|
||||
component={Login}
|
||||
/>
|
||||
<PrivateRoute exact path={`/error=:error`} component={Error520} />
|
||||
<PrivateRoute component={Error404} />
|
||||
</Switch>
|
||||
</Suspense>
|
||||
</Main>
|
||||
</Router>
|
||||
) : (
|
||||
<Offline />
|
||||
);
|
||||
}
|
||||
}
|
||||
// class App extends React.Component {
|
||||
// componentDidMount() {
|
||||
// const {
|
||||
// setModuleInfo,
|
||||
// getUser,
|
||||
// getPortalSettings,
|
||||
// getModules,
|
||||
// getPortalPasswordSettings,
|
||||
// getPortalCultures,
|
||||
// fetchGroups,
|
||||
// fetchPeople,
|
||||
// setIsLoaded,
|
||||
// getIsAuthenticated,
|
||||
// } = this.props;
|
||||
|
||||
const mapStateToProps = (state) => {
|
||||
const { settings } = state.auth;
|
||||
const { homepage } = settings;
|
||||
return {
|
||||
homepage: homepage || config.homepage,
|
||||
};
|
||||
};
|
||||
// setModuleInfo();
|
||||
// getIsAuthenticated().then((isAuthenticated) => {
|
||||
// if (!isAuthenticated) {
|
||||
// utils.updateTempContent();
|
||||
// return setIsLoaded();
|
||||
// } else {
|
||||
// utils.updateTempContent(isAuthenticated);
|
||||
// }
|
||||
|
||||
const mapDispatchToProps = (dispatch) => {
|
||||
return {
|
||||
getIsAuthenticated: () => getIsAuthenticated(dispatch),
|
||||
setModuleInfo: () => {
|
||||
dispatch(setCurrentProductHomePage(config.homepage));
|
||||
dispatch(setCurrentProductId("f4d98afd-d336-4332-8778-3c6945c81ea0"));
|
||||
},
|
||||
getUser: () => getUser(dispatch),
|
||||
getPortalSettings: () => getPortalSettings(dispatch),
|
||||
getModules: () => getModules(dispatch),
|
||||
getPortalPasswordSettings: () => getPortalPasswordSettings(dispatch),
|
||||
getPortalCultures: () => getPortalCultures(dispatch),
|
||||
fetchGroups: () => fetchGroups(dispatch),
|
||||
fetchPeople: () => {
|
||||
var re = new RegExp(`${config.homepage}((/?)$|/filter)`, "gm");
|
||||
const match = window.location.pathname.match(re);
|
||||
// const requests = [
|
||||
// getUser(),
|
||||
// getPortalSettings(),
|
||||
// getModules(),
|
||||
// getPortalPasswordSettings(),
|
||||
// getPortalCultures(),
|
||||
// fetchGroups(),
|
||||
// fetchPeople(),
|
||||
// ];
|
||||
|
||||
if (match && match.length > 0) {
|
||||
const newFilter = getFilterByLocation(window.location);
|
||||
return fetchPeople(newFilter, dispatch);
|
||||
}
|
||||
// Promise.all(requests)
|
||||
// .catch((e) => {
|
||||
// toastr.error(e);
|
||||
// })
|
||||
// .finally(() => {
|
||||
// utils.updateTempContent();
|
||||
// setIsLoaded();
|
||||
// });
|
||||
// });
|
||||
// }
|
||||
|
||||
return Promise.resolve();
|
||||
},
|
||||
setIsLoaded: () => dispatch(setIsLoaded(true)),
|
||||
};
|
||||
};
|
||||
// render() {
|
||||
// const { homepage } = this.props;
|
||||
// console.log("People App render", this.props);
|
||||
// return navigator.onLine ? (
|
||||
// <Router history={history}>
|
||||
// <NavMenu />
|
||||
// <Main>
|
||||
// <Suspense fallback={null}>
|
||||
// <Switch>
|
||||
// <Redirect exact from="/" to={`${homepage}`} />
|
||||
// <PrivateRoute
|
||||
// exact
|
||||
// path={`${homepage}/view/:userId`}
|
||||
// component={Profile}
|
||||
// />
|
||||
// <PrivateRoute
|
||||
// path={`${homepage}/edit/:userId`}
|
||||
// restricted
|
||||
// allowForMe
|
||||
// component={ProfileAction}
|
||||
// />
|
||||
// <PrivateRoute
|
||||
// path={`${homepage}/create/:type`}
|
||||
// restricted
|
||||
// component={ProfileAction}
|
||||
// />
|
||||
// <PrivateRoute
|
||||
// path={[
|
||||
// `${homepage}/group/edit/:groupId`,
|
||||
// `${homepage}/group/create`,
|
||||
// ]}
|
||||
// restricted
|
||||
// component={GroupAction}
|
||||
// />
|
||||
// <PrivateRoute
|
||||
// path={`${homepage}/reassign/:userId`}
|
||||
// restricted
|
||||
// component={Reassign}
|
||||
// />
|
||||
// <PrivateRoute exact path={homepage} component={Home} />
|
||||
// <PrivateRoute path={`${homepage}/filter`} component={Home} />
|
||||
// <PublicRoute
|
||||
// exact
|
||||
// path={[
|
||||
// "/login",
|
||||
// "/login/error=:error",
|
||||
// "/login/confirmed-email=:confirmedEmail",
|
||||
// ]}
|
||||
// component={Login}
|
||||
// />
|
||||
// <PrivateRoute exact path={`/error=:error`} component={Error520} />
|
||||
// <PrivateRoute component={Error404} />
|
||||
// </Switch>
|
||||
// </Suspense>
|
||||
// </Main>
|
||||
// </Router>
|
||||
// ) : (
|
||||
// <Offline />
|
||||
// );
|
||||
// }
|
||||
// }
|
||||
|
||||
export default connect(mapStateToProps, mapDispatchToProps)(App);
|
||||
// const mapStateToProps = (state) => {
|
||||
// const { settings } = state.auth;
|
||||
// const { homepage } = settings;
|
||||
// return {
|
||||
// homepage: homepage || config.homepage,
|
||||
// };
|
||||
// };
|
||||
|
||||
// const mapDispatchToProps = (dispatch) => {
|
||||
// return {
|
||||
// getIsAuthenticated: () => getIsAuthenticated(dispatch),
|
||||
// setModuleInfo: () => {
|
||||
// dispatch(setCurrentProductHomePage(config.homepage));
|
||||
// dispatch(setCurrentProductId("f4d98afd-d336-4332-8778-3c6945c81ea0"));
|
||||
// },
|
||||
// getUser: () => getUser(dispatch),
|
||||
// getPortalSettings: () => getPortalSettings(dispatch),
|
||||
// getModules: () => getModules(dispatch),
|
||||
// getPortalPasswordSettings: () => getPortalPasswordSettings(dispatch),
|
||||
// getPortalCultures: () => getPortalCultures(dispatch),
|
||||
// fetchGroups: () => fetchGroups(dispatch),
|
||||
// fetchPeople: () => {
|
||||
// var re = new RegExp(`${config.homepage}((/?)$|/filter)`, "gm");
|
||||
// const match = window.location.pathname.match(re);
|
||||
|
||||
// if (match && match.length > 0) {
|
||||
// const newFilter = getFilterByLocation(window.location);
|
||||
// return fetchPeople(newFilter, dispatch);
|
||||
// }
|
||||
|
||||
// return Promise.resolve();
|
||||
// },
|
||||
// setIsLoaded: () => dispatch(setIsLoaded(true)),
|
||||
// };
|
||||
// };
|
||||
|
||||
// export default connect(mapStateToProps, mapDispatchToProps)(App);
|
||||
|
19
products/ASC.People/Client/src/People.jsx
Normal file
19
products/ASC.People/Client/src/People.jsx
Normal file
@ -0,0 +1,19 @@
|
||||
import React from "react";
|
||||
// import { useStore } from "react-redux";
|
||||
// import dynamic from "@redux-dynostore/react-redux";
|
||||
// import { attachReducer } from "@redux-dynostore/core";
|
||||
//import rootReducer from "./store/rootReducer";
|
||||
//import portalReducer from "./store/portal/reducers";
|
||||
const PeopleContent = (props) => {
|
||||
// const store = useStore();
|
||||
|
||||
// useEffect(() => {
|
||||
// console.log("Store object", store);
|
||||
// return store.detachReducers(["portal"]);
|
||||
// }, []);
|
||||
|
||||
return <div>PEOPLE PAGE</div>;
|
||||
};
|
||||
|
||||
export default PeopleContent;
|
||||
//export default dynamic("portal", attachReducer(portalReducer))(PeopleContent);
|
@ -1,20 +0,0 @@
|
||||
import React, { useEffect } from "react";
|
||||
import { useStore } from "react-redux";
|
||||
import dynamic from "@redux-dynostore/react-redux";
|
||||
import { attachReducer } from "@redux-dynostore/core";
|
||||
//import rootReducer from "./store/rootReducer";
|
||||
import portalReducer from "./store/portal/reducers";
|
||||
const PeopleContent = (props) => {
|
||||
const store = useStore();
|
||||
|
||||
useEffect(() => {
|
||||
console.log("Store object", store);
|
||||
return store.detachReducers(["portal"]);
|
||||
}, []);
|
||||
|
||||
return <div>PEOPLE PAGE</div>;
|
||||
};
|
||||
|
||||
//export default PeopleContent;
|
||||
|
||||
export default dynamic("portal", attachReducer(portalReducer))(PeopleContent);
|
@ -1,13 +0,0 @@
|
||||
import { Provider } from "react-redux";
|
||||
import store from "studio/store";
|
||||
import Frame from "studio/frame";
|
||||
|
||||
import "./custom.scss";
|
||||
|
||||
const PeoplePage = () => (
|
||||
<Provider store={store}>
|
||||
<Frame page="people" />
|
||||
</Provider>
|
||||
);
|
||||
|
||||
ReactDOM.render(<PeoplePage />, document.getElementById("root"));
|
5
products/ASC.People/Client/src/bootstrap.js
vendored
Normal file
5
products/ASC.People/Client/src/bootstrap.js
vendored
Normal file
@ -0,0 +1,5 @@
|
||||
import App from "./App";
|
||||
import React from "react";
|
||||
import ReactDOM from "react-dom";
|
||||
|
||||
ReactDOM.render(<App />, document.getElementById("root"));
|
@ -1,4 +1,5 @@
|
||||
import("./PeoplePage");
|
||||
import("./bootstrap");
|
||||
|
||||
// import React from "react";
|
||||
// import ReactDOM from "react-dom";
|
||||
// import { Provider } from "react-redux";
|
||||
|
@ -1,13 +1,24 @@
|
||||
const HtmlWebPackPlugin = require("html-webpack-plugin");
|
||||
const ModuleFederationPlugin = require("webpack/lib/container/ModuleFederationPlugin");
|
||||
const HtmlWebpackPlugin = require("html-webpack-plugin");
|
||||
const ModuleFederationPlugin = require("webpack").container
|
||||
.ModuleFederationPlugin;
|
||||
const path = require("path");
|
||||
|
||||
const deps = require("./package.json").dependencies;
|
||||
|
||||
module.exports = {
|
||||
entry: "./src/index",
|
||||
mode: "development",
|
||||
devServer: {
|
||||
contentBase: [path.join(__dirname, "public"), path.join(__dirname, "dist")],
|
||||
contentBasePublicPath: "/products/people/",
|
||||
port: 5002,
|
||||
historyApiFallback: true,
|
||||
hot: false,
|
||||
hotOnly: false,
|
||||
},
|
||||
|
||||
output: {
|
||||
publicPath: "http://localhost:5002",
|
||||
filename: "bundle.js",
|
||||
path: path.resolve(__dirname, "dist"),
|
||||
publicPath: "auto",
|
||||
chunkFilename: "[id].[contenthash].js",
|
||||
},
|
||||
|
||||
resolve: {
|
||||
@ -16,13 +27,6 @@ module.exports = {
|
||||
crypto: false,
|
||||
},
|
||||
},
|
||||
|
||||
devServer: {
|
||||
port: 5002,
|
||||
contentBase: path.join(__dirname, "public"),
|
||||
contentBasePublicPath: "/products/people/",
|
||||
},
|
||||
|
||||
module: {
|
||||
rules: [
|
||||
{
|
||||
@ -79,10 +83,9 @@ module.exports = {
|
||||
filename: "remoteEntry.js",
|
||||
remotes: {
|
||||
studio: "studio@http://localhost:5001/remoteEntry.js",
|
||||
people: "people@http://localhost:5002/remoteEntry.js",
|
||||
},
|
||||
exposes: {
|
||||
"./page": "./src/PeopleContent.jsx",
|
||||
"./page": "./src/People.jsx",
|
||||
},
|
||||
shared: {
|
||||
...deps,
|
||||
@ -96,7 +99,7 @@ module.exports = {
|
||||
},
|
||||
},
|
||||
}),
|
||||
new HtmlWebPackPlugin({
|
||||
new HtmlWebpackPlugin({
|
||||
template: "./public/index.html",
|
||||
}),
|
||||
],
|
||||
|
@ -3,23 +3,20 @@
|
||||
"version": "0.1.0",
|
||||
"private": "true",
|
||||
"scripts": {
|
||||
"start": "webpack-cli serve",
|
||||
"build": "webpack --mode production",
|
||||
"build:dev": "webpack --mode development",
|
||||
"build:start": "cd dist && PORT=5001 npx serve",
|
||||
"start": "webpack-dev-server --open --mode development",
|
||||
"start:live": "webpack-dev-server --open --mode development --liveReload",
|
||||
"docker:build": "docker build . -t login",
|
||||
"docker:run": "docker run -p 5001:5001 login"
|
||||
"serve": "serve dist -p 5001",
|
||||
"clean": "rm -rf dist"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@babel/core": "7.9.6",
|
||||
"@babel/core": "7.12.10",
|
||||
"@babel/plugin-proposal-class-properties": "^7.12.1",
|
||||
"@babel/plugin-proposal-export-default-from": "^7.12.1",
|
||||
"@babel/plugin-transform-runtime": "^7.12.1",
|
||||
"@babel/preset-env": "^7.12.7",
|
||||
"@babel/preset-react": "7.9.4",
|
||||
"@babel/preset-react": "7.12.10",
|
||||
"@svgr/webpack": "^5.5.0",
|
||||
"babel-loader": "8.1.0",
|
||||
"babel-loader": "8.2.2",
|
||||
"css-loader": "^3.6.0",
|
||||
"html-webpack-plugin": "4.5.0",
|
||||
"i18next": "^19.8.4",
|
||||
@ -27,13 +24,13 @@
|
||||
"react-i18next": "^11.7.3",
|
||||
"source-map-loader": "^1.1.2",
|
||||
"style-loader": "1.2.1",
|
||||
"webpack": "5.0.0",
|
||||
"webpack-cli": "3.3.11",
|
||||
"webpack-dev-server": "3.11.0"
|
||||
"webpack": "5.14.0",
|
||||
"webpack-cli": "4.3.1",
|
||||
"webpack-dev-server": "3.11.2",
|
||||
"serve": "11.3.2"
|
||||
},
|
||||
"dependencies": {
|
||||
"@babel/runtime": "^7.12.5",
|
||||
"@redux-dynostore/core": "^3.1.1",
|
||||
"attr-accept": "^2.2.2",
|
||||
"axios": "^0.21.0",
|
||||
"email-addresses": "^3.1.0",
|
||||
|
@ -1,149 +1,164 @@
|
||||
import React, { Suspense, lazy } from "react";
|
||||
import { Router, Route, Switch } from "react-router-dom";
|
||||
import { connect } from "react-redux";
|
||||
// import {
|
||||
// Login,
|
||||
// Error404,
|
||||
// Offline,
|
||||
// ComingSoon
|
||||
// } from "@appserver/common";
|
||||
import CommonStore from "@appserver/common/src/store";
|
||||
import history from "@appserver/common/src/history";
|
||||
import PrivateRoute from "@appserver/common/src/components/PrivateRoute";
|
||||
import PublicRoute from "@appserver/common/src/components/PublicRoute";
|
||||
import NavMenu from "@appserver/common/src/components/NavMenu";
|
||||
import Main from "@appserver/common/src/components/Main";
|
||||
import utils from "@appserver/common/src/utils";
|
||||
import toastr from "@appserver/common/src/components/Toast/toastr";
|
||||
import React from "react";
|
||||
import { Provider } from "react-redux";
|
||||
import Shell from "./Shell";
|
||||
import store from "./store/store";
|
||||
|
||||
import Home from "./components/pages/Home";
|
||||
import "./custom.scss";
|
||||
|
||||
const About = lazy(() => import("./components/pages/About"));
|
||||
const Confirm = lazy(() => import("./components/pages/Confirm"));
|
||||
const Settings = lazy(() => import("./components/pages/Settings"));
|
||||
const Wizard = lazy(() => import("./components/pages/Wizard"));
|
||||
const Payments = lazy(() => import("./components/pages/Payments"));
|
||||
const ThirdPartyResponse = lazy(() => import("./components/pages/ThirdParty"));
|
||||
const {
|
||||
setIsLoaded,
|
||||
getUser,
|
||||
getPortalSettings,
|
||||
getModules,
|
||||
getIsAuthenticated,
|
||||
} = CommonStore.auth.actions;
|
||||
const App = () => (
|
||||
<Provider store={store}>
|
||||
<Shell />
|
||||
</Provider>
|
||||
);
|
||||
|
||||
class App extends React.Component {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
export default App;
|
||||
|
||||
const pathname = window.location.pathname.toLowerCase();
|
||||
this.isThirdPartyResponse = pathname.indexOf("thirdparty") !== -1;
|
||||
}
|
||||
componentDidMount() {
|
||||
const {
|
||||
getPortalSettings,
|
||||
getUser,
|
||||
getModules,
|
||||
setIsLoaded,
|
||||
getIsAuthenticated,
|
||||
} = this.props;
|
||||
// import React, { Suspense, lazy } from "react";
|
||||
// import { Router, Route, Switch } from "react-router-dom";
|
||||
// import { connect } from "react-redux";
|
||||
// // import {
|
||||
// // Login,
|
||||
// // Error404,
|
||||
// // Offline,
|
||||
// // ComingSoon
|
||||
// // } from "@appserver/common";
|
||||
// import CommonStore from "@appserver/common/src/store";
|
||||
// import history from "@appserver/common/src/history";
|
||||
// import PrivateRoute from "@appserver/common/src/components/PrivateRoute";
|
||||
// import PublicRoute from "@appserver/common/src/components/PublicRoute";
|
||||
// import NavMenu from "@appserver/common/src/components/NavMenu";
|
||||
// import Main from "@appserver/common/src/components/Main";
|
||||
// import utils from "@appserver/common/src/utils";
|
||||
// import toastr from "@appserver/common/src/components/Toast/toastr";
|
||||
|
||||
getIsAuthenticated()
|
||||
.then((isAuthenticated) => {
|
||||
if (isAuthenticated) utils.updateTempContent(isAuthenticated);
|
||||
// import Home from "./components/pages/Home";
|
||||
|
||||
if (this.isThirdPartyResponse) {
|
||||
setIsLoaded();
|
||||
return;
|
||||
}
|
||||
// const About = lazy(() => import("./components/pages/About"));
|
||||
// const Confirm = lazy(() => import("./components/pages/Confirm"));
|
||||
// const Settings = lazy(() => import("./components/pages/Settings"));
|
||||
// const Wizard = lazy(() => import("./components/pages/Wizard"));
|
||||
// const Payments = lazy(() => import("./components/pages/Payments"));
|
||||
// const ThirdPartyResponse = lazy(() => import("./components/pages/ThirdParty"));
|
||||
// const {
|
||||
// setIsLoaded,
|
||||
// getUser,
|
||||
// getPortalSettings,
|
||||
// getModules,
|
||||
// getIsAuthenticated,
|
||||
// } = CommonStore.auth.actions;
|
||||
|
||||
const requests = [];
|
||||
if (!isAuthenticated) {
|
||||
requests.push(getPortalSettings());
|
||||
} else if (
|
||||
!window.location.pathname.includes("confirm/EmailActivation")
|
||||
) {
|
||||
requests.push(getUser());
|
||||
requests.push(getPortalSettings());
|
||||
requests.push(getModules());
|
||||
}
|
||||
// class App extends React.Component {
|
||||
// constructor(props) {
|
||||
// super(props);
|
||||
|
||||
Promise.all(requests)
|
||||
.catch((e) => {
|
||||
toastr.error(e);
|
||||
})
|
||||
.finally(() => {
|
||||
utils.updateTempContent();
|
||||
setIsLoaded();
|
||||
});
|
||||
})
|
||||
.catch((err) => toastr.error(err));
|
||||
}
|
||||
// const pathname = window.location.pathname.toLowerCase();
|
||||
// this.isThirdPartyResponse = pathname.indexOf("thirdparty") !== -1;
|
||||
// }
|
||||
// componentDidMount() {
|
||||
// const {
|
||||
// getPortalSettings,
|
||||
// getUser,
|
||||
// getModules,
|
||||
// setIsLoaded,
|
||||
// getIsAuthenticated,
|
||||
// } = this.props;
|
||||
|
||||
render() {
|
||||
return navigator.onLine ? (
|
||||
<Router history={history}>
|
||||
{!this.isThirdPartyResponse && <NavMenu />}
|
||||
<Main>
|
||||
<Suspense fallback={null}>
|
||||
<Switch>
|
||||
<Route exact path="/wizard" component={Wizard} />
|
||||
<PublicRoute
|
||||
exact
|
||||
path={[
|
||||
"/login",
|
||||
"/login/error=:error",
|
||||
"/login/confirmed-email=:confirmedEmail",
|
||||
]}
|
||||
component={Login}
|
||||
/>
|
||||
<Route path="/confirm" component={Confirm} />
|
||||
<PrivateRoute
|
||||
path={`/thirdparty/:provider`}
|
||||
component={ThirdPartyResponse}
|
||||
/>
|
||||
<PrivateRoute
|
||||
exact
|
||||
path={["/", "/error=:error"]}
|
||||
component={Home}
|
||||
/>
|
||||
<PrivateRoute exact path="/about" component={About} />
|
||||
<PrivateRoute restricted path="/settings" component={Settings} />
|
||||
<PrivateRoute
|
||||
exact
|
||||
path={["/coming-soon"]}
|
||||
component={ComingSoon}
|
||||
/>
|
||||
<PrivateRoute path="/payments" component={Payments} />
|
||||
<PrivateRoute component={Error404} />
|
||||
</Switch>
|
||||
</Suspense>
|
||||
</Main>
|
||||
</Router>
|
||||
) : (
|
||||
<Offline />
|
||||
);
|
||||
}
|
||||
}
|
||||
// getIsAuthenticated()
|
||||
// .then((isAuthenticated) => {
|
||||
// if (isAuthenticated) utils.updateTempContent(isAuthenticated);
|
||||
|
||||
const mapStateToProps = (state) => {
|
||||
const { modules, isLoaded, settings } = state.auth;
|
||||
const { organizationName } = settings;
|
||||
return {
|
||||
modules,
|
||||
isLoaded,
|
||||
organizationName,
|
||||
};
|
||||
};
|
||||
// if (this.isThirdPartyResponse) {
|
||||
// setIsLoaded();
|
||||
// return;
|
||||
// }
|
||||
|
||||
const mapDispatchToProps = (dispatch) => {
|
||||
return {
|
||||
getIsAuthenticated: () => getIsAuthenticated(dispatch),
|
||||
getPortalSettings: () => getPortalSettings(dispatch),
|
||||
getUser: () => getUser(dispatch),
|
||||
getModules: () => getModules(dispatch),
|
||||
setIsLoaded: () => dispatch(setIsLoaded(true)),
|
||||
};
|
||||
};
|
||||
// const requests = [];
|
||||
// if (!isAuthenticated) {
|
||||
// requests.push(getPortalSettings());
|
||||
// } else if (
|
||||
// !window.location.pathname.includes("confirm/EmailActivation")
|
||||
// ) {
|
||||
// requests.push(getUser());
|
||||
// requests.push(getPortalSettings());
|
||||
// requests.push(getModules());
|
||||
// }
|
||||
|
||||
export default connect(mapStateToProps, mapDispatchToProps)(App);
|
||||
// Promise.all(requests)
|
||||
// .catch((e) => {
|
||||
// toastr.error(e);
|
||||
// })
|
||||
// .finally(() => {
|
||||
// utils.updateTempContent();
|
||||
// setIsLoaded();
|
||||
// });
|
||||
// })
|
||||
// .catch((err) => toastr.error(err));
|
||||
// }
|
||||
|
||||
// render() {
|
||||
// return navigator.onLine ? (
|
||||
// <Router history={history}>
|
||||
// {!this.isThirdPartyResponse && <NavMenu />}
|
||||
// <Main>
|
||||
// <Suspense fallback={null}>
|
||||
// <Switch>
|
||||
// <Route exact path="/wizard" component={Wizard} />
|
||||
// <PublicRoute
|
||||
// exact
|
||||
// path={[
|
||||
// "/login",
|
||||
// "/login/error=:error",
|
||||
// "/login/confirmed-email=:confirmedEmail",
|
||||
// ]}
|
||||
// component={Login}
|
||||
// />
|
||||
// <Route path="/confirm" component={Confirm} />
|
||||
// <PrivateRoute
|
||||
// path={`/thirdparty/:provider`}
|
||||
// component={ThirdPartyResponse}
|
||||
// />
|
||||
// <PrivateRoute
|
||||
// exact
|
||||
// path={["/", "/error=:error"]}
|
||||
// component={Home}
|
||||
// />
|
||||
// <PrivateRoute exact path="/about" component={About} />
|
||||
// <PrivateRoute restricted path="/settings" component={Settings} />
|
||||
// <PrivateRoute
|
||||
// exact
|
||||
// path={["/coming-soon"]}
|
||||
// component={ComingSoon}
|
||||
// />
|
||||
// <PrivateRoute path="/payments" component={Payments} />
|
||||
// <PrivateRoute component={Error404} />
|
||||
// </Switch>
|
||||
// </Suspense>
|
||||
// </Main>
|
||||
// </Router>
|
||||
// ) : (
|
||||
// <Offline />
|
||||
// );
|
||||
// }
|
||||
// }
|
||||
|
||||
// const mapStateToProps = (state) => {
|
||||
// const { modules, isLoaded, settings } = state.auth;
|
||||
// const { organizationName } = settings;
|
||||
// return {
|
||||
// modules,
|
||||
// isLoaded,
|
||||
// organizationName,
|
||||
// };
|
||||
// };
|
||||
|
||||
// const mapDispatchToProps = (dispatch) => {
|
||||
// return {
|
||||
// getIsAuthenticated: () => getIsAuthenticated(dispatch),
|
||||
// getPortalSettings: () => getPortalSettings(dispatch),
|
||||
// getUser: () => getUser(dispatch),
|
||||
// getModules: () => getModules(dispatch),
|
||||
// setIsLoaded: () => dispatch(setIsLoaded(true)),
|
||||
// };
|
||||
// };
|
||||
|
||||
// export default connect(mapStateToProps, mapDispatchToProps)(App);
|
||||
|
@ -1,15 +0,0 @@
|
||||
import React from "react";
|
||||
import ReactDOM from "react-dom";
|
||||
import { Provider } from "react-redux";
|
||||
import Frame from "./Frame";
|
||||
import store from "./store/store";
|
||||
|
||||
import "./custom.scss";
|
||||
|
||||
const HomePage = () => (
|
||||
<Provider store={store}>
|
||||
<Frame page="home" />
|
||||
</Provider>
|
||||
);
|
||||
|
||||
ReactDOM.render(<HomePage />, document.getElementById("root"));
|
@ -18,10 +18,11 @@ import {
|
||||
} from "@appserver/common/src/store/auth/actions";
|
||||
import { updateTempContent } from "@appserver/common/src/utils";
|
||||
|
||||
const Home = React.lazy(() => import("studio/home"));
|
||||
const Home = React.lazy(() => import("./components/pages/Home"));
|
||||
const Login = React.lazy(() => import("login/page"));
|
||||
const People = React.lazy(() => import("people/page"));
|
||||
const Files = React.lazy(() => import("files/page"));
|
||||
const About = React.lazy(() => import("./components/pages/About"));
|
||||
|
||||
const HomeRoute = () => (
|
||||
<React.Suspense fallback={null}>
|
||||
@ -55,7 +56,14 @@ const FilesRoute = () => (
|
||||
</React.Suspense>
|
||||
);
|
||||
|
||||
const Frame = ({ items = [], page = "home", ...rest }) => {
|
||||
const AboutRoute = () => (
|
||||
<React.Suspense fallback={null}>
|
||||
<ErrorBoundary>
|
||||
<About />
|
||||
</ErrorBoundary>
|
||||
</React.Suspense>
|
||||
);
|
||||
const Shell = ({ items = [], page = "home", ...rest }) => {
|
||||
useEffect(() => {
|
||||
//utils.removeTempContent();
|
||||
|
||||
@ -109,6 +117,7 @@ const Frame = ({ items = [], page = "home", ...rest }) => {
|
||||
path={["/products/files", "/products/files/filter"]}
|
||||
component={FilesRoute}
|
||||
/>
|
||||
<PrivateRoute path={["/about"]} component={AboutRoute} />
|
||||
<PublicRoute
|
||||
exact
|
||||
path={[
|
||||
@ -145,4 +154,4 @@ const mapDispatchToProps = (dispatch) => {
|
||||
};
|
||||
};
|
||||
|
||||
export default connect(mapStateToProps, mapDispatchToProps)(Frame);
|
||||
export default connect(mapStateToProps, mapDispatchToProps)(Shell);
|
5
web/ASC.Web.Client/src/bootstrap.js
vendored
Normal file
5
web/ASC.Web.Client/src/bootstrap.js
vendored
Normal file
@ -0,0 +1,5 @@
|
||||
import React from "react";
|
||||
import ReactDOM from "react-dom";
|
||||
import App from "./App";
|
||||
|
||||
ReactDOM.render(<App />, document.getElementById("root"));
|
@ -2,7 +2,7 @@
|
||||
import Text from "@appserver/components/src/components/text";
|
||||
import Link from "@appserver/components/src/components/link";
|
||||
import PageLayout from "@appserver/common/src/components/PageLayout";
|
||||
import utils from "@appserver/common/src/utils";
|
||||
import { changeLanguage } from "@appserver/common/src/utils";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import version from "../../../../package.json";
|
||||
import styled from "styled-components";
|
||||
@ -15,8 +15,6 @@ const i18n = createI18N({
|
||||
localesPath: "pages/About",
|
||||
});
|
||||
|
||||
const { changeLanguage } = utils;
|
||||
|
||||
const BodyStyle = styled.div`
|
||||
margin-top: 24px;
|
||||
|
||||
|
@ -1,4 +1,4 @@
|
||||
import("./HomePage");
|
||||
import("./bootstrap");
|
||||
|
||||
// import React from "react";
|
||||
// import ReactDOM from "react-dom";
|
||||
|
@ -1,10 +1,11 @@
|
||||
import { createStore, applyMiddleware } from "redux";
|
||||
import thunk from "redux-thunk";
|
||||
import { composeWithDevTools } from "redux-devtools-extension/logOnlyInProduction";
|
||||
import dynostore, {
|
||||
combineReducers,
|
||||
dynamicReducers,
|
||||
} from "@redux-dynostore/core";
|
||||
import { combineReducers } from "redux";
|
||||
// import dynostore, {
|
||||
// combineReducers,
|
||||
// dynamicReducers,
|
||||
// } from "@redux-dynostore/core";
|
||||
//import { createReducerManager } from "./reducerManager";
|
||||
|
||||
import authReducer from "@appserver/common/src/store/auth/reducer";
|
||||
@ -32,7 +33,7 @@ const rootReducer = combineReducers({
|
||||
const store = createStore(
|
||||
//reducerManager.reduce,
|
||||
rootReducer,
|
||||
composeWithDevTools(applyMiddleware(thunk), dynostore(dynamicReducers()))
|
||||
composeWithDevTools(applyMiddleware(thunk))
|
||||
);
|
||||
|
||||
// Optional: Put the reducer manager on the store so it is easily accessible
|
||||
|
@ -1,15 +1,26 @@
|
||||
const HtmlWebPackPlugin = require("html-webpack-plugin");
|
||||
const ModuleFederationPlugin = require("webpack/lib/container/ModuleFederationPlugin");
|
||||
const HtmlWebpackPlugin = require("html-webpack-plugin");
|
||||
const ModuleFederationPlugin = require("webpack").container
|
||||
.ModuleFederationPlugin;
|
||||
const path = require("path");
|
||||
|
||||
const deps = require("./package.json").dependencies;
|
||||
module.exports = {
|
||||
output: {
|
||||
publicPath: "http://localhost:5001/",
|
||||
filename: "bundle.js",
|
||||
path: path.resolve(__dirname, "dist"),
|
||||
},
|
||||
|
||||
module.exports = {
|
||||
entry: "./src/index",
|
||||
mode: "development",
|
||||
devServer: {
|
||||
contentBase: [path.join(__dirname, "public"), path.join(__dirname, "dist")],
|
||||
port: 5001,
|
||||
historyApiFallback: true,
|
||||
hot: false,
|
||||
hotOnly: false,
|
||||
headers: {
|
||||
"Access-Control-Allow-Origin": "*",
|
||||
"Access-Control-Allow-Methods": "GET, POST, PUT, DELETE, PATCH, OPTIONS",
|
||||
"Access-Control-Allow-Headers":
|
||||
"X-Requested-With, content-type, Authorization",
|
||||
},
|
||||
openPage: "http://localhost:8092",
|
||||
},
|
||||
resolve: {
|
||||
extensions: [".jsx", ".js", ".json"],
|
||||
fallback: {
|
||||
@ -17,10 +28,9 @@ module.exports = {
|
||||
},
|
||||
},
|
||||
|
||||
devServer: {
|
||||
port: 5001,
|
||||
openPage: "http://localhost:8092",
|
||||
contentBase: path.join(__dirname, "public"),
|
||||
output: {
|
||||
publicPath: "auto",
|
||||
chunkFilename: "[id].[contenthash].js",
|
||||
},
|
||||
|
||||
module: {
|
||||
@ -84,8 +94,7 @@ module.exports = {
|
||||
login: "login@http://localhost:5020/remoteEntry.js",
|
||||
},
|
||||
exposes: {
|
||||
"./home": "./src/components/pages/Home",
|
||||
"./frame": "./src/Frame",
|
||||
"./shell": "./src/Shell",
|
||||
"./store": "./src/store/store",
|
||||
},
|
||||
shared: {
|
||||
@ -100,7 +109,7 @@ module.exports = {
|
||||
},
|
||||
},
|
||||
}),
|
||||
new HtmlWebPackPlugin({
|
||||
new HtmlWebpackPlugin({
|
||||
template: "./public/index.html",
|
||||
}),
|
||||
],
|
||||
|
@ -3,23 +3,20 @@
|
||||
"version": "0.1.0",
|
||||
"private": "true",
|
||||
"scripts": {
|
||||
"start": "webpack-cli serve",
|
||||
"build": "webpack --mode production",
|
||||
"build:dev": "webpack --mode development",
|
||||
"build:start": "cd dist && PORT=8080 npx serve",
|
||||
"start": "webpack-dev-server --mode development",
|
||||
"start:live": "webpack-dev-server --open --mode development --liveReload",
|
||||
"docker:build": "docker build . -t login",
|
||||
"docker:run": "docker run -p 8080:8080 login"
|
||||
"serve": "serve dist -p 5020",
|
||||
"clean": "rm -rf dist"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@babel/core": "7.9.6",
|
||||
"@babel/core": "7.12.10",
|
||||
"@babel/plugin-proposal-class-properties": "^7.12.1",
|
||||
"@babel/plugin-proposal-export-default-from": "^7.12.1",
|
||||
"@babel/plugin-transform-runtime": "^7.12.1",
|
||||
"@babel/preset-env": "^7.12.7",
|
||||
"@babel/preset-react": "7.9.4",
|
||||
"@babel/preset-react": "7.12.10",
|
||||
"@svgr/webpack": "^5.5.0",
|
||||
"babel-loader": "8.1.0",
|
||||
"babel-loader": "8.2.2",
|
||||
"css-loader": "^3.6.0",
|
||||
"html-webpack-plugin": "4.5.0",
|
||||
"i18next": "^19.8.4",
|
||||
@ -27,9 +24,10 @@
|
||||
"react-i18next": "^11.7.3",
|
||||
"source-map-loader": "^1.1.2",
|
||||
"style-loader": "1.2.1",
|
||||
"webpack": "5.0.0",
|
||||
"webpack-cli": "3.3.11",
|
||||
"webpack-dev-server": "3.11.0"
|
||||
"webpack": "5.14.0",
|
||||
"webpack-cli": "4.3.1",
|
||||
"webpack-dev-server": "3.11.2",
|
||||
"serve": "11.3.2"
|
||||
},
|
||||
"dependencies": {
|
||||
"@babel/runtime": "^7.12.5",
|
||||
|
14
web/ASC.Web.Login/src/App.js
Normal file
14
web/ASC.Web.Login/src/App.js
Normal file
@ -0,0 +1,14 @@
|
||||
import React from "react";
|
||||
import { Provider } from "react-redux";
|
||||
import store from "studio/store";
|
||||
import Shell from "studio/shell";
|
||||
|
||||
const App = () => {
|
||||
return (
|
||||
<Provider store={store}>
|
||||
<Shell />
|
||||
</Provider>
|
||||
);
|
||||
};
|
||||
|
||||
export default App;
|
@ -1,15 +0,0 @@
|
||||
import React from "react";
|
||||
import ReactDOM from "react-dom";
|
||||
import { Provider } from "react-redux";
|
||||
import store from "studio/store";
|
||||
import Frame from "studio/frame";
|
||||
|
||||
const LoginPage = () => {
|
||||
return (
|
||||
<Provider store={store}>
|
||||
<Frame page="login" />
|
||||
</Provider>
|
||||
);
|
||||
};
|
||||
|
||||
ReactDOM.render(<LoginPage />, document.getElementById("root"));
|
5
web/ASC.Web.Login/src/bootstrap.js
vendored
Normal file
5
web/ASC.Web.Login/src/bootstrap.js
vendored
Normal file
@ -0,0 +1,5 @@
|
||||
import React from "react";
|
||||
import ReactDOM from "react-dom";
|
||||
import App from "./App";
|
||||
|
||||
ReactDOM.render(<App />, document.getElementById("root"));
|
@ -1 +1 @@
|
||||
import("./LoginPage.jsx");
|
||||
import("./bootstrap");
|
||||
|
@ -1,13 +1,24 @@
|
||||
const HtmlWebPackPlugin = require("html-webpack-plugin");
|
||||
const ModuleFederationPlugin = require("webpack/lib/container/ModuleFederationPlugin");
|
||||
const HtmlWebpackPlugin = require("html-webpack-plugin");
|
||||
const ModuleFederationPlugin = require("webpack").container
|
||||
.ModuleFederationPlugin;
|
||||
const path = require("path");
|
||||
|
||||
const deps = require("./package.json").dependencies;
|
||||
|
||||
module.exports = {
|
||||
entry: "./src/index",
|
||||
mode: "development",
|
||||
|
||||
devServer: {
|
||||
contentBase: [path.join(__dirname, "public"), path.join(__dirname, "dist")],
|
||||
port: 5020,
|
||||
historyApiFallback: true,
|
||||
hot: false,
|
||||
hotOnly: false,
|
||||
},
|
||||
|
||||
output: {
|
||||
publicPath: "http://localhost:5020/",
|
||||
filename: "bundle.js",
|
||||
path: path.resolve(__dirname, "dist"),
|
||||
publicPath: "auto",
|
||||
chunkFilename: "[id].[contenthash].js",
|
||||
},
|
||||
|
||||
resolve: {
|
||||
@ -17,12 +28,6 @@ module.exports = {
|
||||
},
|
||||
},
|
||||
|
||||
devServer: {
|
||||
port: 5020,
|
||||
contentBase: path.join(__dirname, "public"),
|
||||
contentBasePublicPath: "/login",
|
||||
},
|
||||
|
||||
module: {
|
||||
rules: [
|
||||
{
|
||||
@ -68,10 +73,9 @@ module.exports = {
|
||||
filename: "remoteEntry.js",
|
||||
remotes: {
|
||||
studio: "studio@http://localhost:5001/remoteEntry.js",
|
||||
login: "login@http://localhost:5020/remoteEntry.js",
|
||||
},
|
||||
exposes: {
|
||||
"./page": "./src/LoginContent.jsx",
|
||||
"./page": "./src/Login.jsx",
|
||||
},
|
||||
shared: {
|
||||
...deps,
|
||||
@ -85,7 +89,7 @@ module.exports = {
|
||||
},
|
||||
},
|
||||
}),
|
||||
new HtmlWebPackPlugin({
|
||||
new HtmlWebpackPlugin({
|
||||
template: "./public/index.html",
|
||||
}),
|
||||
],
|
||||
|
Loading…
Reference in New Issue
Block a user