Remax 构建方法的初始运行

155 阅读2分钟

/remax/packages/remax-cli/src/build/index.ts中存在的构建方法有多个,构建应用、构建应用-内部、构建插件、构建组件,不同的方法调用各自的run方法。

构建应用

function buildApp(options: Options)本质上和构建应用-内部是相同的,不同点是只接收一个应用配置参数,然后调用构建应用-内部的方法。

此方式主要用于自定义构建配置,根据自己的项目喜好去配置。

构建应用-内部

function internalBuildApp(options: Options, api: API) 该方式可以构建web平台和各个小程序平台的应用,接收控制台命令行和配置文件合并后的应用配置、生成好的API,不需要更多的编写代码完成配置。

指定日志级别和构建平台后调用run方法,并返回run方法的返回结果即webpack编译器。

构建应用run方法

  • function run(options: Options, api: API): webpack.Compiler 接收配置和API,并返回webpack编译器
  • 指定NODE_ENV的默认值
  • api.loadBuiltinPlugins(options) 注册内置组件errorScreendevtools(web平台、productiondevtools参数false都不注册此组件)
  • api.onBuildStart(options) 调用组件内onBuildStart钩子函数
    onBuildStart(config: Options) {
      this.plugins.forEach(plugin => {
        if (typeof plugin.onBuildStart === 'function') {
          plugin.onBuildStart({ config });
        }
      });
    }
    
  • 调用Web构建WebBuilderrun方法 - /remax/packages/remax-cli/src/build/WebBuilder.ts
  • 调用小程序构建MiniBuilderrun方法 - /remax/packages/remax-cli/src/build/MiniBuilder.ts

构建插件

buildMiniPlugin(options: Options) 构建方法仅接收一个应用配置参数,并返回webpack编译器,可以使用命令行进行调用,也可以根据项目需要自定义调用。

  • 指定NODE_ENV的默认值
  • 日志级别
  • 发布平台
  • 初始化API,当前没有需要注册的组件
  • 调用MiniPluginBuilderrun方法 - /remax/packages/remax-cli/src/build/MiniPluginBuilder.ts

构建组件

buildMiniComponent(options: Options) 构建方法仅接收一个应用配置参数,并返回webpack编译器,可以使用命令行进行调用,也可以根据项目需要自定义调用。

  • 指定NODE_ENV的默认值
  • 日志级别
  • 发布平台
  • 初始化API,当前没有需要注册的组件
  • 调用buildMiniComponentrun方法 - /remax/packages/remax-cli/src/build/buildMiniComponent.ts