How to use @tarojs/transformer-wx - 7 common examples

if (fs.existsSync(templatePath)) {
            template = fs.readFileSync(templatePath).toString()
          }
          if (fs.existsSync(configPath)) {
            configObj = JSON.parse(fs.readFileSync(configPath).toString())
            const usingComponents = configObj.usingComponents
            depComponents = usingComponents ? Object.keys(usingComponents).map(item => ({
              name: item,
              path: usingComponents[item]
            })) : []
          }
        } else {
          const rootProps: { [key: string]: any } = {}
          if (isQuickApp && isRoot) {
            // 如果是快应用，需要提前解析一次 ast，获取 config
            const aheadTransformResult = wxTransformer({
              code,
              sourcePath: file.path,
              sourceDir: this.sourceDir,
              isRoot,
              isTyped: REG_TYPESCRIPT.test(file.path),
              adapter: buildAdapter
            })
            const res = parseAst(aheadTransformResult.ast, buildAdapter)
            if (res.configObj.enablePullDownRefresh || (this.appConfig.window && this.appConfig.window.enablePullDownRefresh)) {
              rootProps.enablePullDownRefresh = true
            }
            if (this.appConfig.tabBar) {
              rootProps.tabBar = this.appConfig.tabBar
            }
            rootProps.pagePath = file.path.replace(this.sourceDir, '').replace(path.extname(file.path), '')
            if (res.hasEnablePageScroll) {

getPages () {
    const { buildAdapter } = this.options
    const appEntry = this.appEntry
    const code = fs.readFileSync(appEntry).toString()
    try {
      const transformResult = wxTransformer({
        code,
        sourcePath: appEntry,
        sourceDir: this.sourceDir,
        isTyped: REG_TYPESCRIPT.test(appEntry),
        isApp: true,
        adapter: buildAdapter
      })
      const { configObj } = parseAst(transformResult.ast, buildAdapter)
      const appPages = configObj.pages
      this.appConfig = configObj
      if (!appPages || appPages.length === 0) {
        throw new Error('缺少页面')
      }
      if (!this.isWatch) {
        printLog(processTypeEnum.COMPILE, '发现入口', this.getShowPath(appEntry))
      }

getPages () {
    const { buildAdapter } = this.options
    const appEntry = this.appEntry
    const code = fs.readFileSync(appEntry).toString()
    const transformResult = wxTransformer({
      code,
      sourcePath: appEntry,
      isTyped: REG_TYPESCRIPT.test(appEntry),
      isApp: true,
      adapter: buildAdapter
    })
    const { configObj } = this.parseAst(transformResult.ast, buildAdapter)
    const appPages = configObj.pages
    if (!appPages || appPages.length === 0) {
      throw new Error('缺少页面')
    }
    taroFileTypeMap[this.appEntry] = {
      type: PARSE_AST_TYPE.ENTRY,
      config: configObj,
      wxml: transformResult.template,
      code: transformResult.code

export default function wxTransformerLoader (source) {
  const { buildAdapter } = getOptions(this)
  const filePath = this.resourcePath
  const wxTransformerParams: any = {
    code: source,
    sourcePath: filePath,
    isTyped: REG_TYPESCRIPT.test(filePath),
    adapter: buildAdapter,
    isNormal: true
  }
  const transformResult = wxTransformer(wxTransformerParams)
  this.callback(null, transformResult.code, transformResult.ast)
  return transformResult.code
}

export function isFileToBeTaroComponent (
  code: string,
  sourcePath: string,
  buildAdapter: BUILD_TYPES
) {
  const transformResult = wxTransformer({
    code,
    sourcePath: sourcePath,
    isTyped: REG_TYPESCRIPT.test(sourcePath),
    adapter: buildAdapter,
    isNormal: true
  })
  const { ast } = transformResult
  let isTaroComponent = false

  traverse(ast, {
    ClassDeclaration (astPath) {
      astPath.traverse({
        ClassMethod (astPath) {
          if (astPath.get('key').isIdentifier({ name: 'render' })) {
            astPath.traverse({
              JSXElement () {

if (this.appConfig.tabBar) {
              rootProps.tabBar = this.appConfig.tabBar
            }
            rootProps.pagePath = file.path.replace(this.sourceDir, '').replace(path.extname(file.path), '')
            if (res.hasEnablePageScroll) {
              rootProps.enablePageScroll = true
            }
            const styleName = this.getStylePath(quickappCommonStyle)
            const taroJsQuickAppStylesPath = path.resolve(this.options.nodeModulesPath, taroJsQuickAppComponents, 'src/common/css')
            const sourceStylePath = path.resolve(taroJsQuickAppStylesPath, styleName)
            this.quickappStyleFiles.add({
              path: sourceStylePath,
              name: styleName
            })
          }
          const transformResult = wxTransformer({
            code,
            sourcePath: file.path,
            sourceDir: this.sourceDir,
            isTyped: REG_TYPESCRIPT.test(file.path),
            isRoot,
            rootProps: isEmptyObject(rootProps) || rootProps,
            adapter: buildAdapter
          })
          let parseAstRes = parseAst(transformResult.ast, buildAdapter)
          configObj = parseAstRes.configObj
          if (isRoot) {
            const showPath = file.path.replace(this.sourceDir, '').replace(path.extname(file.path), '')
            this.pageConfigs.set(showPath, configObj)
          }
          taroSelfComponents = parseAstRes.taroSelfComponents
          const usingComponents = configObj.usingComponents

fileList.forEach(file => {
      const code = fs.readFileSync(file.path).toString()
      const transformResult = wxTransformer({
        code,
        sourcePath: file.path,
        isTyped: REG_TYPESCRIPT.test(file.path),
        isRoot,
        adapter: buildAdapter
      })
      const { configObj } = this.parseAst(transformResult.ast, buildAdapter)
      taroFileTypeMap[file.path] = {
        type: isRoot ? PARSE_AST_TYPE.PAGE : PARSE_AST_TYPE.COMPONENT,
        config: configObj,
        wxml: transformResult.template,
        code: transformResult.code
      }
      let depComponents = transformResult.components
      if (depComponents && depComponents.length) {
        depComponents.forEach(item => {