import { createPlugin } from '@modern-js/core' ; import type { Configuration } from 'webpack' ; import type Chain from 'webpack-chain' ; import { isFastRefresh } from '@modern-js/utils' ; export default createPlugin ( ( ) => ( { config ( ) { return { tools : { webpack : ( config , { chain , name } ) => { if ( name === 'client' && isFastRefresh ( ) ) { const ReactFastRefreshPlugin = require ( '@pmmmwh/react-refresh-webpack-plugin' ) ; chain . plugin ( 'react-fast-refresh' ) . use ( ReactFastRefreshPlugin , [ { overlay : false , exclude : [ /node_modules/ ] , } , ] ) ; const loaders = chain . module . rule ( 'loaders' ) ; const babelOptions = loaders . oneOf ( 'js' ) . use ( 'babel' ) . get ( 'options' ) ; loaders . oneOf ( 'js' ) . use ( 'babel' ) . options ( { ... babelOptions , plugins : [ ... ( babelOptions . plugins || [ ] ) , require . resolve ( 'react-refresh/babel' ) , ] , } ) ; } } , } , } ; } , } ) , { name : '@modern-js/plugin-fast-refresh' } ) as any ;