wornut / nuxt-micro-frontend

🎳Nuxt module for micro-frontend solution

Nuxt-Micro-Frontend

Using frontend microservices with Nuxt, support qiankun now

中文

📖 Release Notes

Setup

1. Add @femessage/nuxt-micro-frontend dependency to your project

yarn add @femessage/nuxt-micro-frontend -D 

# or npm install @femessage/nuxt-micro-frontend

2. Add @femessage/nuxt-micro-frontend to the modules section of nuxt.config.js

{
  modules: [
    // Simple usage
    '@femessage/nuxt-micro-frontend',

    // With options
    ['@femessage/nuxt-micro-frontend', { /* module options */ }]
  ]
}

Module Options

Documents

If want to set headers recommend to set build.devMiddleware.headers, see Nuxt API: The build Property > devMiddleware

path: the MFE lifecycle hook file path relative to rootDir

force: skip version check and force to use this module

unique: If use qiankun, sub application's package name should unique. Set unique to true can create a unique umd target.

Support Micro Front-End Framework

• qiankun
• single-SPA waiting for test and verify

LifeCycle hooks file example

Qiankun

• add mounted and beforeUnmount hook to get vue instance

Development

1. Clone this repository
2. Install dependencies using yarn install or npm install
3. Start development server using npm run dev

License

MIT License

Copyright (c) FEMessage