async function start()

in packages/build-plugin-lowcode/src/index.js [341:513]


async function start(options, pluginOptions) {
  const { registerTask, getAllTask, onGetWebpackConfig } = options;
  const { rootDir, pkg: package, commandArgs } = options.context;
  const { https } = commandArgs;
  if (!PARSED_NPM_NAME) {
    PARSED_NPM_NAME = parseNpmName(package.name);
  }
  const {
    package: packageName = package.name,
    library = PARSED_NPM_NAME.uniqueName,
    umdUrls,
    renderUrls,
    editUrls,
    baseLibrary = 'react',
    groups = DEFAULT_GROUPS,
    categories = DEFAULT_CATEGORIES,
    extraAssets = [],
    builtinAssets = [],
    ignoreComponents = {},
    staticResources = {},
    disableStyleLoader = false,
    engineScope = '@ali',
    externals = {},
    setterMap = {},
    fullbackMeta = 'default',
    type = 'component',
    setterName,
    presetConfig = {},
    customPlugins = [],
  } = pluginOptions || {};
  if (baseLibrary === 'rax' && Array.isArray(extraAssets)) {
    extraAssets.push(
      'https://g.alicdn.com/code/npm/@alife/mobile-page/0.1.1/build/lowcode/assets-prod.json',
    );
  }
  const metaExportName = `${PARSED_NPM_NAME.uniqueName}Meta`;
  const { viewPath, metaPathMap, renderViewPathMap, platforms } = await debounceBuild(
    options,
    pluginOptions,
    false,
  );
  const devViewUrls = !disableStyleLoader ? ['/view.js'] : ['/view.js', '/view.css'];
  const advancedRenderUrls = {};
  platforms.forEach((platform) => {
    advancedRenderUrls[platform] = [`./${platform}.view.js`];
  });

  if (type === 'setter' && setterName) {
    setterMap[setterName] = path.resolve(rootDir, 'src/index');
  }

  let _setterMap = '{';
  const setterImportStr = Object.keys(setterMap || {})
    .map((item) => {
      _setterMap += `\n  ${item},`;
      const setterStr = setterMap[item];
      const lastIndexOfAt = setterStr.lastIndexOf('@');
      let npmName = setterStr;
      if (lastIndexOfAt > 0) {
        npmName = setterStr.slice(0, lastIndexOfAt);
      }
      return `import ${item} from '${npmName}';`;
    })
    .join('\n');
  _setterMap += '\n}';
  const indexJs = generateEntry({
    template: 'index.jsx',
    filename: 'index.jsx',
    rootDir,
    params: {
      package: packageName,
      version: package.version,
      library,
      urls: JSON.stringify(renderUrls || umdUrls || devViewUrls),
      editUrls: JSON.stringify(editUrls || umdUrls || devViewUrls),
      advancedRenderUrls: JSON.stringify(advancedRenderUrls),
      devMode: true,
      metaExportName,
      baseLibrary,
      groups: JSON.stringify(groups),
      categories: JSON.stringify(categories),
      extraAssets: JSON.stringify(extraAssets),
      builtinAssets: JSON.stringify(builtinAssets),
      ignoreComponents: JSON.stringify(ignoreComponents),
      setterImportStr,
      setterMap: _setterMap,
      metaPathMap: JSON.stringify(metaPathMap),
      fullbackMeta,
      setterName: setterName || '',
      type,
      presetConfig: JSON.stringify(presetConfig),
      customPlugins: JSON.stringify(customPlugins),
    },
  });
  const previewJs = generateEntry({
    template: 'preview.jsx',
    filename: 'preview.jsx',
    rootDir,
    params: {
      isRax: baseLibrary === 'rax',
    },
  });
  if (getAllTask().includes('lowcode-dev')) return;
  registerTask('lowcode-dev', getWebpackConfig('development'));
  onGetWebpackConfig('lowcode-dev', (config) => {
    const entry = {
      index: indexJs,
      preview: previewJs,
      ...metaPathMap,
      ...renderViewPathMap,
    };
    if (!editUrls && !umdUrls) {
      entry.view = viewPath;
    }

    config.merge({
      entry,
    });
    config.plugin('index').use(HtmlWebpackPlugin, [
      {
        inject: false,
        templateParameters: {
          ...STATIC_RESOURCES_MAP[engineScope],
          ...staticResources,
        },
        template: require.resolve('./public/index.html'),
        filename: 'index.html',
      },
    ]);
    config.plugin('designer').use(HtmlWebpackPlugin, [
      {
        inject: false,
        templateParameters: {
          ...STATIC_RESOURCES_MAP[engineScope],
          ...staticResources,
        },
        template: require.resolve('./public/designer.html'),
        filename: 'designer.html',
      },
    ]);
    config.plugin('preview').use(HtmlWebpackPlugin, [
      {
        inject: false,
        templateParameters: {
          previewCssUrl: '',
          isRax: baseLibrary === 'rax',
          ...STATIC_RESOURCES_MAP[engineScope],
        },
        template: require.resolve('./public/preview.html'),
        filename: 'preview.html',
      },
    ]);
    config.devServer.headers({ 'Access-Control-Allow-Origin': '*' });

    config.devServer.https(Boolean(https));
    config.devServer.set('transportMode', 'ws');
    // WSL 环境下正常的文件 watch 失效,需切换为 poll 模式
    if (isWsl) {
      config.merge({
        devServer: {
          watchOptions: {
            poll: 1000,
          },
        },
      });
    }
    config.externals({ ...COMMON_EXTERNALS_MAP[engineScope], ...externals });
    !disableStyleLoader && useStyleLoader(config);
    if (baseLibrary === 'rax') {
      config.module.rule('scss').use('rpx-loader').loader('rpx-loader').before('css-loader');
    }
  });
}