1.17.6 • Published 4 days ago

@garfish/remote-module v1.17.6

Weekly downloads
-
License
MIT
Repository
github
Last release
4 days ago

@garfish/remote-module

@garfish/remote-module can be used alone or combined with Garfish.

Usage

// module
const React = require('React');

exports.One = function (props) {
  return React.createElement('div', null, [props.text]);
};

exports.Two = function () {
  return React.createElement('span');
};
import React from 'React';
import {
  preload,
  esModule,
  loadModule,
  loadModuleSync,
  setModuleConfig,
  cacheModules,
} from '@garfish/remote-module';

setModuleConfig({
  externals: { React }, // Environment variables required by remoteModules
  alias: { Component: 'https://xx.js' },
});

const RemoteCm = React.lazy(() =>
  loadModule('https://xx.js').then((modules) => {
    console.log(modules); // One, Two
    return esModule(modules.One);
  }),
);

// Or
const RemoteCm = React.lazy(() => {
  return loadModule('@Component.One').then(esModule);
});

// Use `React.Suspense` to use components
<React.Suspense fallback={<div>loading</div>}>
  <div>
    <RemoteCm text="cool!" />
  </div>
</React.Suspense>;

Other usage

// Or
loadModule('https://xx.js', {
  cache: true, // This will cache the module instance, default value is `true`
  externals: { React },
  error: (err, info, alias) => {
    console.error(err);
    return 'render error content';
  },
}).then((modules) => {
  console.log(modules); // One, Two
});

// Or load the remote modules synchronously
preload(['https://1.js', 'https://2.js']).then(() => {
  const modules = loadModuleSync('https://1.js');
  console.log(modules); // One, Two
});

// View already cached modules
console.log(cacheModules);

Combined with Garfish

If you are using "garfish" micro frontend.

// Child app
import { preload } from '@garfish/remote-module';

export const provider = () => {
  render({ dom }) {
    // When the resources of the remote module are preloaded,
    // You can use synchronous syntax to load remote modules in the current application.
    // You can combine "webpack5 module federation" or other "component markets"
    preload(menu.remoteModules).then(() => {
      ReactDom.render(<App/>, dom)
    })
  },

  destroy() {
    ...
  }
}

You can also configure the information of remote modules in the template, so that these modules can be used synchronously when the child application is initialized.

<!DOCTYPE html>
<html lang="en">
  <head>
    <!-- Preload Module resources, but will not execute code -->
    <meta
      name="garfish-remote-module"
      alias="Component"
      src="http://localhost:3000/remoteModule1.js"
    />
    <!-- With the async attribute will not block page rendering -->
    <meta
      name="garfish-remote-module"
      src="http://localhost:3000/remoteModule2.js"
      async
    />
  </head>
  <body></body>
</html>
import { loadModuleSync } from '@garfish/remote-module';

function App() {
  // const One = loadModuleSync('@Component.One');
  const { One } = loadModuleSync('http://localhost:3000/remoteModule1');

  return (
    <div>
      <One />
    </div>
  );
}

Alias

You can simplify the long url with the alias config.

import { loadModule, setModuleConfig } from '@garfish/remote-module';

setModuleConfig({
  alias: { utils: 'http://localhost:3000/remoteModule' },
});

loadModule('@utils').then((utils) => {
  console.log(utils);
});

loadModule('@utils.isObject').then((isObject) => {
  console.log(isObject);
});

Remote module

The remote module only supports the commonjs format, but you can also package the module in the umd format.

module.exports = {
  a() {},
  b() {},
};

If the module wants to return asynchronous content.

When the module exports a promise, you can only use the RemoteModule.loadModule method, otherwise an error will be reported.

// The loadModule method is provided by default
const loadModule = require('loadModule');

module.exports = new Promise((resolve) => {
  loadModule('@otherModules').then((modules) => {
    resolve({
      a() {},
      b() {},
      ...modules,
    });
  });
});
garfishremote-module
@garfish/loader@garfish/utils@garfish/hooks
@everything-registry/sub-chunk-352@infinitebrahmanuniverse/nolb-_gar@zalastax/nolb-_gar@byted-starry/micro-components
1.17.7-beta-20240506085817.0

4 days ago

1.17.7-beta-20240506085815.0

4 days ago

1.17.7-beta-20240506090621.0

4 days ago

1.17.6

2 months ago

1.17.6-beta-20240321114158.0

2 months ago

1.17.5-beta-20240318070321.0

2 months ago

1.17.5

2 months ago

1.17.5-beta-20240315062626.0

2 months ago

1.17.4

3 months ago

1.17.4-beta-20240205065925.0

3 months ago

1.17.3

4 months ago

1.17.3-beta-20240124033822.0

4 months ago

1.17.3-beta-20231204134452.0

5 months ago

1.16.4-beta-20230926083651.0

8 months ago

1.16.3-beta-20230705075815.0

10 months ago

1.16.3-beta-20230705043447.0

10 months ago

1.17.2-beta-20231024122032.0

7 months ago

1.16.2-beta-20230630083313.0

11 months ago

1.17.1-beta-20231010040426.0

7 months ago

1.16.3-beta-20230906074217.0

8 months ago

1.17.2-beta-20231018121321.0

7 months ago

1.16.3

8 months ago

1.16.2

11 months ago

1.17.2

6 months ago

1.17.1

7 months ago

1.17.0

7 months ago

1.16.4-beta-20230918113006.0

8 months ago

1.16.4-beta-20230926105340.0

8 months ago

1.17.3-beta-20231204075536.0

5 months ago

1.16.1-beta-20230620033809.0

11 months ago

1.16.1-beta-20230620030240.0

11 months ago

1.16.1

11 months ago

1.16.0

11 months ago

1.15.0-beta-20230526095608.0

12 months ago

1.14.4-beta-20230428130858.0

1 year ago

1.14.4-beta-20230601072007.0

11 months ago

1.14.4-beta-20230504040716.0

1 year ago

1.14.4-beta-20230428123738.0

1 year ago

1.14.4

12 months ago

1.14.4-beta-20230517105319.0

12 months ago

1.14.4-beta-20230530135104.0

12 months ago

1.14.4-beta-20230428113956.0

1 year ago

1.15.0

12 months ago

1.14.4-beta-20230504031426.0

1 year ago

1.14.4-beta-20230504081711.0

1 year ago

1.14.4-beta-20230517102049.0

12 months ago

1.14.2-beta-20230309030245.0

1 year ago

1.14.3

1 year ago

1.14.2

1 year ago

1.14.3-beta-20230314031220.0

1 year ago

1.14.1-beta-20230213132507.0

1 year ago

1.14.1

1 year ago

1.14.2-beta-20230222115558.0

1 year ago

1.13.4-beta-20230131093042.0

1 year ago

1.13.6

1 year ago

1.13.5

1 year ago

1.13.4

1 year ago

1.13.7-beta-20230209122902.0

1 year ago

1.14.0

1 year ago

1.13.7-beta-20230209115646.0

1 year ago

1.13.4-beta-20230116132249.0

1 year ago

1.13.7-beta-20230209122052.0

1 year ago

1.11.4-beta-20221109035211.0

2 years ago

1.12.2-beta-20221206075713.0

1 year ago

1.13.2-beta-20230104063252.0

1 year ago

1.13.3-beta-20230103145211.0

1 year ago

1.11.4-beta-20221121100239.0

1 year ago

1.11.4-beta-20221024024844.0

2 years ago

1.12.1

1 year ago

1.12.0

2 years ago

1.11.4-beta-20221020030717.0

2 years ago

1.11.4-beta-20221116035946.0

1 year ago

1.13.2-beta-20221222234551.0

1 year ago

1.13.2

1 year ago

1.13.1

1 year ago

1.13.0

1 year ago

1.13.3

1 year ago

1.12.1-beta-20221123045926.0

1 year ago

1.11.4-beta-20221122073120.0

1 year ago

1.13.1-beta-20221219070121.0

1 year ago

1.12.2-beta-20221205114612.0

1 year ago

1.12.1-beta-20221205075544.0

1 year ago

1.12.1-beta-20221124024619.0

1 year ago

1.11.4-beta-20221123071803.0

1 year ago

1.13.2-beta-20221226063216.0

1 year ago

1.11.3-beta-20221018022115.0

2 years ago

1.12.1-beta-20221122081844.0

1 year ago

1.11.4-beta-20221011080627.0

2 years ago

1.11.3

2 years ago

1.11.2

2 years ago

1.4.7-beta.10

2 years ago

1.4.7-beta.9

2 years ago

1.11.1

2 years ago

1.11.0

2 years ago

1.4.7-beta.7

2 years ago

1.4.7-beta.8

2 years ago

1.4.7-beta.5

2 years ago

1.4.7-beta.6

2 years ago

1.4.7-beta.3

2 years ago

1.4.7-beta.4

2 years ago

1.4.8-beta-20220913133511.0

2 years ago

1.8.2-beta-20220703091141.0

2 years ago

1.10.2

2 years ago

1.8.3-beta-20220713072558.0

2 years ago

1.9.0-beta.1

2 years ago

1.10.1

2 years ago

1.10.0

2 years ago

1.10.3-beta-20220814035535.0

2 years ago

1.10.3-beta-20220815082847.0

2 years ago

1.9.1-beta-20220810114858.0

2 years ago

1.9.0

2 years ago

1.10.2-beta-20220810124315.0

2 years ago

1.8.2

2 years ago

1.9.1-beta-20220721091045.0

2 years ago

1.10.2-beta-20220810115229.0

2 years ago

1.9.1-beta-20220719131640.0

2 years ago

1.6.0

2 years ago

1.5.5

2 years ago

1.8.2-beta-20220610100627.0

2 years ago

1.6.0-beta-20220519035122.0

2 years ago

1.6.0-beta-20220526030938.0

2 years ago

1.8.1

2 years ago

1.8.0

2 years ago

1.5.6-beta-20220527100419.0

2 years ago

1.7.2

2 years ago

1.7.1

2 years ago

1.7.0

2 years ago

1.5.4-beta-20220513042436.0

2 years ago

1.5.4

2 years ago

1.5.3

2 years ago

1.5.4-beta-20220512093241.0

2 years ago

1.5.2

2 years ago

1.5.3-beta-20220427112735.0

2 years ago

1.5.3-beta-20220428024545.0

2 years ago

1.6.0-beta-20220420054116.0

2 years ago

1.5.1

2 years ago

1.5.0

2 years ago

1.4.5-beta-20220406085842.0

2 years ago

1.4.6

2 years ago

1.4.5

2 years ago

1.4.6-beta-20220411031623.0

2 years ago

1.4.5-beta-20220406104532.0

2 years ago

1.4.5-beta-20220406062409.0

2 years ago

1.4.2-beta-20220314140836.0

2 years ago

1.4.4

2 years ago

1.4.3

2 years ago

1.4.2

2 years ago

1.4.2-beta-20220315070714.0

2 years ago

1.2.17-beta-1641880836352.0

2 years ago

1.3.4-beta-1645091550602.0

2 years ago

1.2.8

2 years ago

1.3.4-beta-1645091653541.0

2 years ago

1.3.4-beta-1645070952271.0

2 years ago

1.3.4-beta-1645002104592.0

2 years ago

1.3.8

2 years ago

1.2.12

2 years ago

1.2.13

2 years ago

1.2.10

2 years ago

1.2.11

2 years ago

1.2.16

2 years ago

1.2.17

2 years ago

1.2.14

2 years ago

1.2.15

2 years ago

1.4.2-beta-20220309105146.0

2 years ago

1.3.9-beta-1645785698122.0

2 years ago

1.2.7-beta-1640069055250.0

2 years ago

1.4.1-beta-20220225105315.0

2 years ago

1.2.12-beta-1640273569556.0

2 years ago

1.2.9

2 years ago

1.3.4-beta-1644462566844.0

2 years ago

1.2.14-beta-1641872856086.0

2 years ago

1.4.1

2 years ago

1.4.0

2 years ago

1.4.1-beta-20220308034652.0

2 years ago

1.3.4-beta-20220215040050.0

2 years ago

1.2.18

2 years ago

1.2.19

2 years ago

1.3.7-beta-1645175976235.0

2 years ago

1.3.7

2 years ago

1.3.6

2 years ago

1.3.5

2 years ago

1.3.4

2 years ago

1.3.3

2 years ago

1.3.2

2 years ago

1.3.1

2 years ago

1.3.0

2 years ago

1.2.20

2 years ago

1.2.13-beta-1640674295572.0

2 years ago

1.2.11-beta-1640226043327.0

2 years ago

1.2.0

2 years ago

1.2.2-beta.4

2 years ago

1.2.2-beta.3

2 years ago

1.2.2-beta.2

2 years ago

1.2.2-beta.1

2 years ago

1.2.5

2 years ago

1.2.4

2 years ago

1.2.3

2 years ago

1.2.2

2 years ago

1.2.1

2 years ago

1.1.1-beta.2

2 years ago

1.1.9-beta.1

2 years ago

1.1.1-beta.1

2 years ago

1.1.1

2 years ago

1.2.3-beta.1

2 years ago

1.1.9

2 years ago

1.1.8

2 years ago

1.1.7

2 years ago

1.1.6

2 years ago

1.1.5

2 years ago

1.1.4

2 years ago

1.1.2

2 years ago

1.1.10-beta.2

2 years ago

1.1.10-beta.1

2 years ago

1.1.6-beta.1

2 years ago

1.1.3-beta.1

2 years ago

1.1.6-beta.2

2 years ago

1.1.6-beta.3

2 years ago

1.1.6-beta.4

2 years ago

1.1.6-beta.5

2 years ago

1.1.6-beta.6

2 years ago

1.1.6-beta.7

2 years ago

1.1.3-beta.3

2 years ago

1.1.0-beta.1

2 years ago

1.1.0

2 years ago

1.0.19-beta.1

3 years ago

1.0.23-beta.1

2 years ago

1.0.22-beta.1

2 years ago

1.0.19

3 years ago

1.0.22

2 years ago

1.0.21

3 years ago

1.0.20

3 years ago

1.0.26

2 years ago

1.0.25

2 years ago

1.0.24

2 years ago

1.0.23

2 years ago

1.0.17-beta.1

3 years ago

1.0.18

3 years ago

1.0.17

3 years ago

1.0.16

3 years ago

1.0.13-beta.4

3 years ago

1.0.13-beta.5

3 years ago

1.0.13-beta.2

3 years ago

1.0.13-beta.3

3 years ago

1.0.12-beta.1

3 years ago

1.0.13-beta.1

3 years ago

1.0.2

3 years ago

1.0.0

3 years ago

1.0.8

3 years ago

1.0.7

3 years ago

1.0.6

3 years ago

1.0.5

3 years ago

1.0.4

3 years ago

1.0.3

3 years ago

0.1.17-beta.8

3 years ago

1.0.14-beta.2

3 years ago

1.0.14-beta.1

3 years ago

1.0.11-beta.1

3 years ago

1.0.11-beta.2

3 years ago

1.0.11-beta.3

3 years ago

1.0.11-beta.4

3 years ago

1.0.6-beta.4

3 years ago

1.0.8-beta.1

3 years ago

1.0.6-beta.1

3 years ago

1.0.6-beta.3

3 years ago

1.0.6-beta.2

3 years ago

1.0.4-beta.1

3 years ago

1.0.1-beta.2

3 years ago

1.0.1-beta.1

3 years ago

1.0.11

3 years ago

1.0.10

3 years ago

1.0.15

3 years ago

1.0.14

3 years ago

1.0.13

3 years ago

1.0.12

3 years ago

0.1.17-beta.7

3 years ago

0.1.17-beta.6

3 years ago

0.1.17-beta.5

3 years ago

0.1.17-beta.4

3 years ago

0.1.17-beta.3

3 years ago

0.1.17-beta.1

3 years ago

0.1.16

3 years ago

0.1.12

3 years ago

0.1.13

3 years ago

0.1.14

3 years ago

0.1.15

3 years ago

0.1.10

3 years ago

0.1.11

3 years ago

0.1.10-beta.1

3 years ago

0.1.9

3 years ago

0.1.13-beta.10

3 years ago

0.1.13-beta.12

3 years ago

0.1.13-beta.11

3 years ago

0.1.13-beta.9

3 years ago

0.1.13-beta.7

3 years ago

0.1.13-beta.8

3 years ago

0.1.13-beta.5

3 years ago

0.1.8

3 years ago

0.1.7

3 years ago

0.1.0

3 years ago

0.1.1

3 years ago

0.1.0-alpha.0

3 years ago

0.1.4

3 years ago

0.1.3

3 years ago

0.1.5

3 years ago

0.0.59

3 years ago

0.0.59-alpha.0.2

3 years ago

0.0.53-0.0.59-alpha.0.0

3 years ago

0.0.54

3 years ago

0.0.55

3 years ago

0.0.58

3 years ago

0.0.52

3 years ago

0.0.53

3 years ago

0.0.50

3 years ago

0.0.48-alpha.0

3 years ago

0.0.49

3 years ago

0.0.46

3 years ago

0.0.47

3 years ago

0.0.43

3 years ago

0.0.44

3 years ago

0.0.45

3 years ago

0.0.41

3 years ago

0.0.42

3 years ago

0.0.40

3 years ago

0.0.35

3 years ago

0.0.36

3 years ago

0.0.38-alpha.3

3 years ago

0.0.38-alpha.1

3 years ago

0.0.37

3 years ago

0.0.38-alpha.4

3 years ago

0.0.38-alpha.5

3 years ago

0.0.35-alpha.3

3 years ago

0.0.35-alpha.0

3 years ago

0.0.34

3 years ago

0.0.33-alpha.0

3 years ago

0.0.32

3 years ago

0.0.32-alpha.0

3 years ago

0.0.32-alpha.1

3 years ago

0.0.31

3 years ago