logo
指南
配置
插件
指南
配置
插件
简体中文

empShare

remove in v3.1.4
EmpShare

v3.1.4版本后，使用 RspackEmpSharePlugin代替empShare配置。

EmpShare

基于 module federation 进行二次封装开发、适配更多业务模型
目前支持 基本 module federation的共享方式、基于cdn的共享方式以及ESM的共享方式

基础共享配置

emp-config.js
import {defineConfig} from '@empjs/cli'
export default defineConfig(({mode, env}) => {
  return {
    empShare: {
      name: 'unpkglib',
      exposes: {
        './App': './src/App',
      },
      shared: {
        react: {singleton: true},
        'react-dom': {singleton: true},
      },
    },
  }
})

FastMode 共享配置

FastMode

基于 module federation v2 进行二次封装开发、目前EMP最优的共享模式

emp-config.js
import {defineConfig} from '@empjs/cli'
export default defineConfig(({mode, env}) => {
  return {
    empShare: {
      fastMode: {
        runtimeHost:'二次封装库、包含基础库、sdk等',
        framework: 'react',
      },
      name: 'unpkglib',
      exposes: {
        './App': './src/App',
      },
      shared: {
        react: {singleton: true},
        'react-dom': {singleton: true},
      },
    },
  }
})

CDN共享配置

emp-config.js
import {defineConfig} from '@empjs/cli'
export default defineConfig((store) => {
 //
   const shareLib =
    store.mode === 'development'
      ? {
          react: 'React@https://cdn.jsdelivr.net/npm/[email protected]/umd/react.development.min.js',
          'react-dom': 'ReactDOM@https://cdn.jsdelivr.net/npm/[email protected]/umd/react-dom.development.js',
        }
      : {
          react: 'React@https://cdn.jsdelivr.net/npm/[email protected]/umd/react.production.min.js',
          'react-dom': 'ReactDOM@https://cdn.jsdelivr.net/npm/[email protected]/umd/react-dom.production.min.js',
        }
//
  return {
    empShare: {
      name: 'unpkglib',
      exposes: {
        './App': './src/App',
      },
      shareLib,
    },
  }
})

ESM共享配置

emp-config.js
import {defineConfig} from '@empjs/cli'
export default defineConfig(store => {
  return {
    build : {
     target:'es2015',
    },
    empShare: {
    name: 'unpkglib',
    exposes: {
        './App': './src/App',
    },
    shareLib: {
          react: `https://esm.sh/[email protected]${store.mode === 'development' ? '?dev' : ''}`,
          'react-dom': `https://esm.sh/[email protected]${store.mode === 'development' ? '?dev' : ''}`,
          'react/jsx-dev-runtime': 'https://esm.sh/react/jsx-dev-runtime.js',
          'react/jsx-runtime': 'https://esm.sh/react/jsx-runtime.js',
    },
    //是否开启 importMap
    useImportMap:true,
    },
  }
})