It has been three years since the first code submission of ICestark in 2019.05.09. In the three years of alcohol, ICestark with a brand new appearance in front of everyone. Finally, ICestark officially launched its own official website.

Please click here for the official website link:

micro-frontends.ice.work/

What is icestark?

Over the past three years, our mission remains the same: to provide leading micro front-end solutions for large systems. That is:

  • From the space, solve the efficiency problem brought by team collaboration;
  • In terms of time, solve the efficiency problem caused by the upgrade and iteration of mid and long tail applications.

On the basis of ensuring the user experience and development experience of a system, ICestark realizes the independent development and deployment of each micro-application just like back-end micro-service. Through icestARK runtime management of application registration and rendering, Boulder application is completely decoupled.

If you’re interested in learning more about ICestark, check out the website above. Or check out our series:

  • Icestark, a micro front end solution for large workstations
  • ICE exploration in micro front end

Announcing 2.4.0

We also released icestark version 2.4.0. In this release, we:

  • Resolved Script errors that might be encountered

When a microapplication encounters an Error during its online operation, the monitoring platform usually captures the output of Script Error:

This is because for security reasons, browsers deliberately hide specific error messages thrown by JavaScript files in other domains to avoid sensitive information being captured by uncontrolled third-party scripts. As a result, browsers only allow scripts in the same domain to catch specific error messages, while other scripts only know that an error occurred, but not the content of the error.

To address cross-domain catching of JavaScript exceptions, add the crossorigin=”anonymous” attribute to 

// Microapplication configuration
{
  name: 'app1'.activePath: '/seller'.url: [
    '//unpkg.com/app1/js/chunk.js'.'//unpkg.com/app1/js/index.js'.'//unpkg.com/app1/css/index.css',],...// Add crossorigin="anonymous" to all js resources in microapp app1
  scriptAttributes: ["crossorigin=anonymous"].// or
  / / for ` / / unpkg.com/app1/js/chunk.js ` resources add crossorigin = "anonymous"
  scriptAttributes: (url) = > url.includes('chunk')? ["crossorigin=anonymous"] : [],}Copy the code
  • Enhanced sandbox capabilities

In the latest version, we fixed some of the abnormal behavior that the eval function performed in the sandbox. The behavior is that the eval function error was bind causing the execution scope to be global. You can verify this simply by using the following code:

function foo (obj) {
  eval.bind(window) ('console.log(obj)');
}

boo({a: 1});
// Uncaught ReferenceError: obj is not defined
Copy the code

In previous versions, false values in the sandbox were not caught. Such as:

// Execute in the sandbox
window.a = false;

console.log(a);
// undefined
Copy the code

In the most recent version, we fixed this behavior.

  • Provides props for ice user consumption framework application delivery

For ICE users, we provide build-plugin-icestark for quick access to ICestark. In the latest build-plugin-Icestark release, you can get the props parameters passed by the framework application from the props of the page component.

const { frameworkProps: { name } } = props;
  return <div>{name}</div>;
}

export default Detail;
Copy the code

For more updates to ICestark 2.4.0, visit our blog:

Micro – frontends. Ice. Work/blog / 00 – ice…

The follow-up plan

In future releases, we will continue to improve the Icestark sandbox, improve the microapplication experience, and provide simpler and more convenient style isolation solutions. In the latest version of 2.5.0, we will:

  • Optimized icestark native development and sandbox debugging experience (issue);
  • forReact Component 和 ApiAligns all fields with the use of. This may cause certain fields to be in a future release@deprecatedPhase (rfc)
  • [Fixed] Issue of using Prompt component for secondary pop-up