@modern-js/app-tools 1.21.5 → 2.0.0-beta.1

package/dist/js/modern/analyze/utils.js

@@ -4,7 +4,6 @@ import { isReact18, normalizeToPosixPath } from '@modern-js/utils';
 import { FILE_SYSTEM_ROUTES_FILE_NAME } from "./constants";
 export const walkDirectory = dir => fs.readdirSync(dir).reduce((previous, filename) => {
   const filePath = path.join(dir, filename);
-
   if (fs.statSync(filePath).isDirectory()) {
     return [...previous, ...walkDirectory(filePath)];
   } else {
@@ -47,7 +46,6 @@ export const getDefaultImports = ({
     }],
     value: normalizeToPosixPath(customBootstrap.replace(srcDirectory, internalSrcAlias))
   }].filter(Boolean);
-
   if (fileSystemRoutes) {
     const route = {
       specifiers: [{
@@ -55,7 +53,6 @@ export const getDefaultImports = ({
       }],
       value: normalizeToPosixPath(`${internalDirAlias}/${entryName}/${FILE_SYSTEM_ROUTES_FILE_NAME}`)
     };
-
     if (fileSystemRoutes.globalApp) {
       imports.push({
         specifiers: [{
@@ -66,7 +63,6 @@ export const getDefaultImports = ({
     } else {
       route.initialize = 'const App = false;';
     }
-
     imports.push(route);
   } else {
     imports.push({
@@ -76,17 +72,15 @@ export const getDefaultImports = ({
       value: normalizeToPosixPath(entry.replace(srcDirectory, internalSrcAlias))
     });
   }
-
   return imports;
 };
 export const isRouteComponentFile = filePath => {
   if (/\.(d|test|spec|e2e)\.(js|jsx|ts|tsx)$/.test(filePath)) {
     return false;
   }
-
   if (['.js', '.jsx', '.ts', '.tsx'].includes(path.extname(filePath))) {
     return true;
   }
-
   return false;
-};
+};
+export const replaceWithAlias = (base, filePath, alias) => normalizeToPosixPath(path.join(alias, path.relative(base, filePath)));

package/dist/js/modern/builder/builderPlugins/compatModern.js

@@ -0,0 +1,208 @@
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+import { join } from 'path';
+import { mergeBuilderConfig } from '@modern-js/builder-shared';
+import { template as lodashTemplate } from '@modern-js/utils/lodash';
+import HtmlWebpackPlugin from '@modern-js/builder-webpack-provider/html-webpack-plugin';
+import { getEntryOptions } from '@modern-js/utils';
+import { BottomTemplatePlugin } from "../webpackPlugins/htmlBottomTemplate";
+import { HtmlAsyncChunkPlugin } from "../webpackPlugins/htmlAsyncChunkPlugin";
+import { createCopyPattern } from "../share";
+import RouterPlugin from "../webpackPlugins/routerPlugin";
+/**
+ * Provides default configuration consistent with `@modern-js/webpack`
+ */
+export const PluginCompatModern = (appContext, modernConfig, options) => ({
+  name: 'builder-plugin-compat-modern',
+  setup(api) {
+    api.modifyBuilderConfig(config => {
+      if (isStreamingSSR(modernConfig)) {
+        return mergeBuilderConfig(config, {
+          html: {
+            inject: 'body'
+          }
+        });
+      }
+      return config;
+    });
+    api.modifyWebpackChain((chain, {
+      target,
+      CHAIN_ID,
+      isProd
+    }) => {
+      const builderNormalizedConfig = api.getNormalizedConfig();
+      // set webpack config name
+      if (target === 'node') {
+        chain.name('server');
+      } else if (target === 'modern-web') {
+        chain.name('modern');
+      } else {
+        chain.name('client');
+      }
+      chain.resolve.modules.add('node_modules').add(join(api.context.rootPath, 'node_modules'));
+
+      // apply node compat
+      if (target === 'node') {
+        applyNodeCompat(chain, modernConfig, isProd);
+      }
+      if (isHtmlEnabled(builderNormalizedConfig, target)) {
+        applyBottomHtmlWebpackPlugin({
+          api,
+          chain,
+          CHAIN_ID,
+          appContext,
+          modernConfig
+        });
+        applyAsyncChunkHtmlPlugin({
+          chain,
+          CHAIN_ID,
+          modernConfig
+        });
+      }
+
+      // apply copy plugin
+      // const copyPatterns = createCopyPatterns(chain, appContext, modernConfig);
+      const defaultCopyPattern = createCopyPattern(appContext, modernConfig, 'public', chain);
+      chain.plugin(CHAIN_ID.PLUGIN.COPY).tap(args => {
+        var _args$;
+        return [{
+          patterns: [...(((_args$ = args[0]) === null || _args$ === void 0 ? void 0 : _args$.patterns) || []), defaultCopyPattern]
+        }];
+      });
+      const {
+        entrypoints
+      } = appContext;
+      const existNestedRoutes = entrypoints.some(entrypoint => entrypoint.nestedRoutesEntry);
+      chain.plugin('route-plugin').use(RouterPlugin, [{
+        existNestedRoutes
+      }]);
+      function isHtmlEnabled(config, target) {
+        var _config$tools;
+        return ((_config$tools = config.tools) === null || _config$tools === void 0 ? void 0 : _config$tools.htmlPlugin) !== false && target !== 'node' && target !== 'web-worker';
+      }
+    });
+    if (options) {
+      applyCallbacks(api, options);
+    }
+  }
+});
+
+/**
+ * register builder hooks callback
+ */
+function applyCallbacks(api, options) {
+  options.onAfterBuild && api.onAfterBuild(options.onAfterBuild);
+  options.onAfterCreateCompiler && api.onAfterCreateCompiler(options.onAfterCreateCompiler);
+  options.onAfterStartDevServer && api.onAfterStartDevServer(options.onAfterStartDevServer);
+  options.onBeforeBuild && api.onBeforeBuild(options.onBeforeBuild);
+  options.onBeforeCreateCompiler && api.onBeforeCreateCompiler(options.onBeforeCreateCompiler);
+  options.onBeforeStartDevServer && api.onBeforeStartDevServer(options.onBeforeStartDevServer);
+  options.onDevCompileDone && api.onDevCompileDone(options.onDevCompileDone);
+  options.onExit && api.onExit(options.onExit);
+}
+
+/**
+ * compat some config, if target is `node`
+ */
+function applyNodeCompat(chain, modernConfig, isProd) {
+  // apply node resolve extensions
+  for (const ext of ['.node.js', '.node.jsx', '.node.ts', '.node.tsx']) {
+    chain.resolve.extensions.prepend(ext);
+  }
+
+  // apply filterEntriesBySSRConfig
+  filterEntriesBySSRConfig(isProd, chain, modernConfig.server, modernConfig.output);
+  function filterEntriesBySSRConfig(isProd, chain, serverConfig, outputConfig) {
+    var _outputConfig$ssg;
+    const entries = chain.entryPoints.entries();
+    // if prod and ssg config is true or function
+    if (isProd && ((outputConfig === null || outputConfig === void 0 ? void 0 : outputConfig.ssg) === true || typeof (outputConfig === null || outputConfig === void 0 ? void 0 : (_outputConfig$ssg = outputConfig.ssg) === null || _outputConfig$ssg === void 0 ? void 0 : _outputConfig$ssg[0]) === 'function')) {
+      return;
+    }
+
+    // if single entry has ssg config
+    // `ssg: {}` is not allowed if multi entry
+    const entryNames = Object.keys(entries);
+    if (isProd && entryNames.length === 1 && outputConfig !== null && outputConfig !== void 0 && outputConfig.ssg) {
+      return;
+    }
+
+    // collect all ssg entries
+    const ssgEntries = [];
+    if (isProd && outputConfig !== null && outputConfig !== void 0 && outputConfig.ssg) {
+      const {
+        ssg
+      } = outputConfig;
+      entryNames.forEach(name => {
+        if (ssg[name]) {
+          ssgEntries.push(name);
+        }
+      });
+    }
+    const {
+      ssr,
+      ssrByEntries
+    } = serverConfig || {};
+    entryNames.forEach(name => {
+      if (!ssgEntries.includes(name) && (ssr && (ssrByEntries === null || ssrByEntries === void 0 ? void 0 : ssrByEntries[name]) === false || !ssr && !(ssrByEntries !== null && ssrByEntries !== void 0 && ssrByEntries[name]))) {
+        chain.entryPoints.delete(name);
+      }
+    });
+  }
+}
+
+/**
+ * inject bottom template
+ */
+function applyBottomHtmlWebpackPlugin({
+  api,
+  chain,
+  modernConfig,
+  appContext,
+  CHAIN_ID
+}) {
+  // inject bottomTemplate into html-webpack-plugin
+  for (const entryName of Object.keys(api.context.entry)) {
+    // FIXME: the only need necessary
+    const baseTemplateParams = _objectSpread({
+      entryName,
+      title: getEntryOptions(entryName, modernConfig.output.title, modernConfig.output.titleByEntries, appContext.packageName),
+      mountId: modernConfig.output.mountId
+    }, getEntryOptions(entryName, modernConfig.output.templateParameters, modernConfig.output.templateParametersByEntries, appContext.packageName));
+    chain.plugin(`${CHAIN_ID.PLUGIN.HTML}-${entryName}`).tap(args => [_objectSpread(_objectSpread({}, args[0] || {}), {}, {
+      __internal__: true,
+      bottomTemplate: appContext.htmlTemplates[`__${entryName}-bottom__`] && lodashTemplate(appContext.htmlTemplates[`__${entryName}-bottom__`])(baseTemplateParams)
+    })]);
+  }
+  chain.plugin(CHAIN_ID.PLUGIN.BOTTOM_TEMPLATE).use(BottomTemplatePlugin, [HtmlWebpackPlugin]);
+}
+const isStreamingSSR = userConfig => {
+  const isStreaming = ssr => ssr && typeof ssr === 'object' && ssr.mode === 'stream';
+  const {
+    server
+  } = userConfig;
+  if (isStreaming(server.ssr)) {
+    return true;
+  }
+
+  // Since we cannot apply different plugins for different entries,
+  // we regard the whole app as streaming ssr only if one entry meets the requirement.
+  if (server !== null && server !== void 0 && server.ssrByEntries && typeof server.ssrByEntries === 'object') {
+    for (const name of Object.keys(server.ssrByEntries)) {
+      if (isStreaming(server.ssrByEntries[name])) {
+        return true;
+      }
+    }
+  }
+  return false;
+};
+function applyAsyncChunkHtmlPlugin({
+  chain,
+  modernConfig,
+  CHAIN_ID
+}) {
+  if (isStreamingSSR(modernConfig)) {
+    chain.plugin(CHAIN_ID.PLUGIN.HTML_ASYNC_CHUNK).use(HtmlAsyncChunkPlugin, [HtmlWebpackPlugin]);
+  }
+}

package/dist/js/modern/builder/createHtmlConfig.js

@@ -0,0 +1,58 @@
+import path from 'path';
+import { findExists } from '@modern-js/utils';
+export function createHtmlConfig(normalizedConfig, appContext) {
+  const {
+    disableHtmlFolder,
+    favicon,
+    faviconByEntries,
+    inject,
+    injectByEntries,
+    meta,
+    metaByEntries,
+    mountId,
+    title,
+    titleByEntries,
+    scriptExt,
+    templateParameters,
+    templateParametersByEntries
+  } = normalizedConfig.output;
+  const {
+    configDir
+  } = normalizedConfig.source;
+
+  // transform Modernjs `output.scriptExt` to Builder `html.crossorigin`  configuration
+  const builderCrossorigin = createBuilderCrossorigin(scriptExt);
+  const builderAppIcon = createBuilderAppIcon(configDir, appContext);
+  const builderFavicon = createBuilderFavicon(favicon, configDir, appContext);
+  return {
+    appIcon: builderAppIcon,
+    disableHtmlFolder,
+    favicon: builderFavicon,
+    faviconByEntries,
+    inject,
+    injectByEntries,
+    meta,
+    metaByEntries,
+    mountId,
+    title,
+    titleByEntries,
+    crossorigin: builderCrossorigin,
+    templateByEntries: appContext.htmlTemplates,
+    templateParameters,
+    templateParametersByEntries: templateParametersByEntries
+  };
+}
+const ICON_EXTENSIONS = ['png', 'jpg', 'jpeg', 'svg', 'ico'];
+export function createBuilderAppIcon(configDir, appContext) {
+  const appIcon = findExists(ICON_EXTENSIONS.map(ext => path.resolve(appContext.appDirectory, configDir, `icon.${ext}`)));
+  return typeof appIcon === 'string' ? appIcon : undefined;
+}
+export function createBuilderCrossorigin(scriptExt) {
+  var _scriptExtCustomConfi;
+  const scriptExtCustomConfig = scriptExt === null || scriptExt === void 0 ? void 0 : scriptExt.custom;
+  return scriptExtCustomConfig !== null && scriptExtCustomConfig !== void 0 && (_scriptExtCustomConfi = scriptExtCustomConfig.test) !== null && _scriptExtCustomConfi !== void 0 && _scriptExtCustomConfi.test('.js') && (scriptExtCustomConfig === null || scriptExtCustomConfig === void 0 ? void 0 : scriptExtCustomConfig.attribute) === 'crossorigin' ? scriptExtCustomConfig.value : undefined;
+}
+export function createBuilderFavicon(favicon, configDir, appContext) {
+  const defaultFavicon = findExists(ICON_EXTENSIONS.map(ext => path.resolve(appContext.appDirectory, configDir, `favicon.${ext}`)));
+  return favicon || defaultFavicon || undefined;
+}

package/dist/js/modern/builder/createOutputConfig.js

@@ -0,0 +1,70 @@
+import { createCopyPattern } from "./share";
+export function createOutputConfig(normalizedConfig, appContext) {
+  // TODO: add `externals` options in Modern.
+
+  const {
+    assetPrefix,
+    copy,
+    cssModuleLocalIdentName,
+    cssPath,
+    jsPath,
+    htmlPath,
+    mediaPath,
+    path,
+    disableInlineRuntimeChunk,
+    disableMinimize,
+    disableSourceMap,
+    disableTsChecker,
+    enableCssModuleTSDeclaration,
+    enableInlineScripts,
+    enableInlineStyles,
+    polyfill,
+    dataUriLimit,
+    disableAssetsCache,
+    enableLatestDecorators,
+    disableCssModuleExtension
+  } = normalizedConfig.output;
+  const defaultCopyPattern = createCopyPattern(appContext, normalizedConfig, 'upload');
+  const builderCopy = copy ? [...copy, defaultCopyPattern] : [defaultCopyPattern];
+  return {
+    assetPrefix,
+    copy: builderCopy,
+    distPath: {
+      root: path,
+      css: cssPath,
+      js: jsPath,
+      html: htmlPath,
+      // `@modern-js/webpack` output all media files to `dist/media` by default
+      svg: mediaPath || 'media',
+      image: mediaPath || 'media',
+      font: mediaPath || 'media',
+      media: mediaPath || 'media'
+    },
+    dataUriLimit: {
+      svg: dataUriLimit,
+      image: dataUriLimit,
+      font: dataUriLimit,
+      media: dataUriLimit
+    },
+    disableCssModuleExtension,
+    disableInlineRuntimeChunk,
+    disableMinimize,
+    disableSourceMap,
+    disableTsChecker,
+    enableCssModuleTSDeclaration,
+    enableInlineScripts,
+    enableInlineStyles,
+    polyfill,
+    // We need to do this in the app-tools prepare hook because some files will be generated into the dist directory in the analyze process
+    cleanDistPath: false,
+    disableFilenameHash: disableAssetsCache,
+    enableLatestDecorators,
+    filename: {
+      css: cssModuleLocalIdentName
+    },
+    // `@modern-js/webpack` used to generate asset manifest by default
+    enableAssetManifest: true,
+    // compatible the modern-js with fallback behavior
+    enableAssetFallback: true
+  };
+}

package/dist/js/modern/builder/createSourceConfig.js

@@ -0,0 +1,74 @@
+import { dirname, isAbsolute, posix, sep } from 'path';
+import { globby, mergeAlias, findMonorepoRoot, isModernjsMonorepo } from '@modern-js/utils';
+export function createSourceConfig(normalizedConfig, appContext) {
+  const {
+    alias,
+    envVars,
+    globalVars,
+    include,
+    moduleScopes,
+    preEntry
+  } = normalizedConfig.source;
+  const builderGlobalVars = globalVars || {};
+  for (const envVar of envVars || []) {
+    const envVarValue = process.env[envVar];
+    envVarValue && (builderGlobalVars[`process.env.${envVar}`] = envVarValue);
+  }
+  const builderModuleScope = createBuilderModuleScope(moduleScopes);
+  const builderInclude = createBuilderInclude(include, appContext);
+  return {
+    alias: mergeAlias(alias),
+    moduleScopes: builderModuleScope,
+    globalVars: builderGlobalVars,
+    include: builderInclude,
+    preEntry,
+    // ensure resolve.extensions same as before
+    resolveExtensionPrefix: '.web'
+  };
+}
+export function createBuilderInclude(include, appContext) {
+  const defaultInclude = [appContext.internalDirectory];
+  const transformInclude = (include || []).map(include => {
+    if (typeof include === 'string') {
+      if (isAbsolute(include)) {
+        return include;
+      }
+      return new RegExp(include);
+    }
+    return include;
+  }).concat(defaultInclude); // concat default Include
+
+  const root = findMonorepoRoot(appContext.appDirectory);
+  if (!root) {
+    return transformInclude;
+  }
+  const modernjsMonorepo = isModernjsMonorepo(root);
+  if (modernjsMonorepo) {
+    const paths = globby.sync(posix.join(root, 'features', '**', 'package.json'), {
+      ignore: ['**/node_modules/**/*']
+    }).map(pathname => dirname(pathname) + sep);
+    return [...paths, ...transformInclude];
+  }
+  return transformInclude;
+}
+export function createBuilderModuleScope(moduleScopes) {
+  if (moduleScopes) {
+    let builderModuleScope = [];
+    const DEFAULT_SCOPES = ['./src', './shared', /node_modules/];
+    if (Array.isArray(moduleScopes)) {
+      if (isPrimitiveScope(moduleScopes)) {
+        builderModuleScope = DEFAULT_SCOPES.concat(moduleScopes);
+      } else {
+        builderModuleScope = [DEFAULT_SCOPES, ...moduleScopes];
+      }
+    } else {
+      builderModuleScope = [DEFAULT_SCOPES, moduleScopes];
+    }
+    return builderModuleScope;
+  } else {
+    return undefined;
+  }
+  function isPrimitiveScope(items) {
+    return items.every(item => typeof item === 'string' || Object.prototype.toString.call(item) === '[object RegExp]');
+  }
+}

package/dist/js/modern/builder/createToolsConfig.js

@@ -0,0 +1,87 @@
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+import { applyOptionsChain } from '@modern-js/utils';
+export function createToolsConfig(normalizedConfig) {
+  const {
+    disableCssExtract,
+    enableTsLoader
+  } = normalizedConfig.output;
+  const {
+    autoprefixer,
+    babel,
+    minifyCss,
+    terser,
+    webpack,
+    webpackChain,
+    tsLoader,
+    styledComponents,
+    sass,
+    postcss,
+    less,
+    htmlPlugin,
+    // TODO: remove modernjs tools.lodash config
+    // eslint-disable-next-line @typescript-eslint/no-unused-vars
+    lodash
+  } = normalizedConfig.tools;
+  const builderTsLoader = createBuilderTsLoader(tsLoader, enableTsLoader);
+  const builderTsChecker = createBuilderTsChecker(normalizedConfig.output);
+  return {
+    tsChecker: builderTsChecker,
+    styleLoader: disableCssExtract ? {} : undefined,
+    cssExtract: disableCssExtract ? false : undefined,
+    autoprefixer,
+    babel,
+    minifyCss,
+    terser,
+    webpack,
+    webpackChain: webpackChain,
+    tsLoader: builderTsLoader,
+    styledComponents: styledComponents,
+    sass: sass,
+    postcss: postcss,
+    less: less,
+    // can't remove comment in html minify.
+    // some html template insert by using those comments.
+    htmlPlugin: [config => _objectSpread(_objectSpread({}, config), {}, {
+      minify: typeof config.minify === 'object' ? _objectSpread(_objectSpread({}, config.minify), {}, {
+        removeComments: false
+      }) : config.minify
+    }),
+    // eslint-disable-next-line no-nested-ternary
+    ...(Array.isArray(htmlPlugin) ? htmlPlugin : htmlPlugin ? [htmlPlugin] : [])]
+  };
+}
+function createBuilderTsLoader(tsLoader, enableTsLoader) {
+  const useTsLoader = Boolean(enableTsLoader);
+  if (!useTsLoader) {
+    return undefined;
+  }
+  const defaultTsLoader = {
+    compilerOptions: {
+      target: 'es5',
+      module: 'ESNext'
+    },
+    transpileOnly: false,
+    allowTsInNodeModules: true
+  };
+  return (_, utils) => applyOptionsChain(defaultTsLoader, tsLoader, utils);
+}
+export function createBuilderTsChecker(output) {
+  if (output.enableTsLoader) {
+    return false;
+  }
+  const defaultTsChecker = {
+    issue: {
+      include: [{
+        file: '**/src/**/*'
+      }],
+      exclude: [{
+        file: '**/*.(spec|test).ts'
+      }, {
+        file: '**/node_modules/**/*'
+      }]
+    }
+  };
+  return defaultTsChecker;
+}

package/dist/js/modern/builder/index.js

@@ -0,0 +1,108 @@
+import { createBuilder } from '@modern-js/builder';
+import { builderWebpackProvider } from '@modern-js/builder-webpack-provider';
+import { applyOptionsChain, isUseSSRBundle } from '@modern-js/utils';
+import { PluginCompatModern } from "./builderPlugins/compatModern";
+import { createHtmlConfig } from "./createHtmlConfig";
+import { createOutputConfig } from "./createOutputConfig";
+import { createSourceConfig } from "./createSourceConfig";
+import { createToolsConfig } from "./createToolsConfig";
+function getBuilderTargets(normalizedConfig) {
+  const targets = ['web'];
+  if (normalizedConfig.output.enableModernMode && !targets.includes('modern-web')) {
+    targets.push('modern-web');
+  }
+  if (isUseSSRBundle(normalizedConfig)) {
+    targets.push('node');
+  }
+  return targets;
+}
+export async function createBuilderForEdenX({
+  normalizedConfig,
+  appContext,
+  compatPluginConfig
+}) {
+  const builderConfig = createBuilderProviderConfig(normalizedConfig, appContext);
+  // create webpack provider
+  const webpackProvider = builderWebpackProvider({
+    builderConfig
+  });
+  const target = getBuilderTargets(normalizedConfig);
+  const builderOptions = createBuilderOptions(target, appContext);
+  const builder = await createBuilder(webpackProvider, builderOptions);
+  await applyBuilderPlugins(builder, normalizedConfig, appContext, compatPluginConfig);
+  return builder;
+}
+function createBuilderProviderConfig(normalizedConfig, appContext) {
+  const source = createSourceConfig(normalizedConfig, appContext);
+  const html = createHtmlConfig(normalizedConfig, appContext);
+  const output = createOutputConfig(normalizedConfig, appContext);
+  const tools = createToolsConfig(normalizedConfig);
+  return {
+    source,
+    html,
+    output,
+    tools,
+    dev: {
+      https: normalizedConfig.dev.https,
+      assetPrefix: normalizedConfig.dev.assetPrefix
+    },
+    performance: {
+      // `@modern-js/webpack` used to remove moment locale by default
+      removeMomentLocale: true
+    }
+  };
+}
+export function createBuilderOptions(target, appContext) {
+  // create entries
+
+  const entries = {};
+  const {
+    entrypoints = [],
+    checkedEntries
+  } = appContext;
+  for (const {
+    entryName,
+    entry
+  } of entrypoints) {
+    if (checkedEntries && !checkedEntries.includes(entryName)) {
+      continue;
+    }
+    if (entryName in entries) {
+      entries[entryName].push(entry);
+    } else {
+      entries[entryName] = [entry];
+    }
+  }
+  return {
+    cwd: appContext.appDirectory,
+    target,
+    configPath: appContext.configFile || undefined,
+    entry: entries,
+    framework: appContext.metaName
+  };
+}
+
+/**
+ * register builder Plugin by condition
+ */
+async function applyBuilderPlugins(builder, normalizedConfig, appContext, compatPluginConfig) {
+  if (!normalizedConfig.output.disableNodePolyfill) {
+    const {
+      PluginNodePolyfill
+    } = await import('@modern-js/builder-plugin-node-polyfill');
+    builder.addPlugins([PluginNodePolyfill()]);
+  }
+  if (normalizedConfig.tools.esbuild) {
+    const {
+      esbuild: esbuildOptions
+    } = normalizedConfig.tools;
+    const {
+      PluginEsbuild
+    } = await import('@modern-js/builder-plugin-esbuild');
+    builder.addPlugins([PluginEsbuild({
+      loader: false,
+      minimize: applyOptionsChain({}, esbuildOptions)
+    })]);
+  }
+  builder.addPlugins([PluginCompatModern(appContext, normalizedConfig, compatPluginConfig)]);
+}