2025-04-18 - single spa: Difference between revisions
Jump to navigation
Jump to search
(Created page with " 2025-04-18 2025-04-18") |
No edit summary |
||
| (8 intermediate revisions by one other user not shown) | |||
| Line 1: | Line 1: | ||
=Install= | |||
==Global Install== | |||
*install in shell only one time when never install single-spa in Local computer before. | |||
npm install -g create-single-spa | |||
==Install single-spa project== | |||
npx create-single-spa | |||
*npx create-single-spa@latest //use when install old version when don't update version | |||
==Update Install== | |||
test choose | |||
*npm update -g create-single-spa | |||
*sudo npm install -g create-single-spa@latest | |||
===Organization name=== | |||
*izaraFrontends | |||
===Project name=== | |||
*<your repository name> eg. table-config | |||
=Open port & Run script = | |||
*start root-config | |||
npm start | |||
*start other micro-frontend | |||
npm start -- --port 9001(set port) | |||
=Root-config= | |||
==import explain== | |||
===key=== | |||
* Application name | |||
* format Organization_name/Project_name eg. @izaraFrontends/root-config | |||
===value=== | |||
* sorce of microfrontend file | |||
* example path of sorce izara-frontend-core-user-details_pack/src/izaraFrontends-user-detail.js | |||
*example imports | |||
<syntaxhighlight lang="JavaScript"> | |||
"imports": { | |||
"@izaraFrontends/root-config": "//localhost:9000/izaraFrontends-root-config.js", | |||
"@izaraFrontends/user-detail": "//localhost:9002/izaraFrontends-user-detail.js", | |||
} | |||
</syntaxhighlight> | |||
==registerApplication== | |||
===izaraFrontends-root-config.js=== | |||
*all aplication register here don't need to change anything | |||
===index.ejs=== | |||
*create route of aplication here | |||
<syntaxhighlight lang="html"> | |||
<route path="login"> | |||
<application name="@izaraFrontends/authentication"></application> | |||
</route> | |||
</syntaxhighlight> | |||
[[Category:Working documents| 2025-04-18]] | [[Category:Working documents| 2025-04-18]] | ||
[[Category:Working documents - Creating 2025-04-18 - single spa| 2025-04-18]] | [[Category:Working documents - Creating 2025-04-18 - single spa| 2025-04-18]] | ||
Latest revision as of 10:48, 12 June 2025
Install
Global Install
- install in shell only one time when never install single-spa in Local computer before.
npm install -g create-single-spa
Install single-spa project
npx create-single-spa
- npx create-single-spa@latest //use when install old version when don't update version
Update Install
test choose
- npm update -g create-single-spa
- sudo npm install -g create-single-spa@latest
Organization name
- izaraFrontends
Project name
- <your repository name> eg. table-config
Open port & Run script
- start root-config
npm start
- start other micro-frontend
npm start -- --port 9001(set port)
Root-config
import explain
key
- Application name
- format Organization_name/Project_name eg. @izaraFrontends/root-config
value
- sorce of microfrontend file
- example path of sorce izara-frontend-core-user-details_pack/src/izaraFrontends-user-detail.js
- example imports
"imports": {
"@izaraFrontends/root-config": "//localhost:9000/izaraFrontends-root-config.js",
"@izaraFrontends/user-detail": "//localhost:9002/izaraFrontends-user-detail.js",
}
registerApplication
izaraFrontends-root-config.js
- all aplication register here don't need to change anything
index.ejs
- create route of aplication here
<route path="login">
<application name="@izaraFrontends/authentication"></application>
</route>