Import () loading common components problem?

import () can split the code and reduce packaging. For example, two large components (pages) AMagi B both need public button.js, so how to introduce the A page into button and leak it to the app.js,app configuration router corresponding to the corresponding component page.

import React from "react";
import ReactDOM from "react-dom";
import { useState, useEffect } from "react";

async function run() {
  let v= await import("./button");
  let Button=v.button-mid
 ..
 ..
  let A = () => {
    return (
      <div>
       ...
       ...
        <Button onClick={d}/>
      </div>
    );
  };
 // const rootElement = document.getElementById("root");
 // ReactDOM.render(<A />, rootElement);
}
run();

how does the A component export for app.js to use (configure routing), or is my page built wrong.

May.25,2022
Menu