createCompileToFunctionFn() — vue Function Reference

Architecture documentation for the createCompileToFunctionFn() function in to-function.ts from the vue codebase.

Function typescript TemplateCompiler CodeGen calls 6 called by 1

Entity Profile

TemplateCompiler→ CodeGen→ createCompileToFunctionFn() — vue Function Reference

Dependency Diagram

graph TD
  f2d18c28_9782_02d0_c983_083b86068c69["createCompileToFunctionFn()"]
  04307c3f_aa3a_2ee6_85e3_aebc122881e3["createCompilerCreator()"]
  04307c3f_aa3a_2ee6_85e3_aebc122881e3 -->|calls| f2d18c28_9782_02d0_c983_083b86068c69
  7a0093e3_a58a_af71_971f_488b65897e74["extend()"]
  f2d18c28_9782_02d0_c983_083b86068c69 -->|calls| 7a0093e3_a58a_af71_971f_488b65897e74
  bb53260c_b91e_4c53_9052_5970ccb57525["toString()"]
  f2d18c28_9782_02d0_c983_083b86068c69 -->|calls| bb53260c_b91e_4c53_9052_5970ccb57525
  e3484a9f_f8a5_4082_0208_641d58b965c3["warn()"]
  f2d18c28_9782_02d0_c983_083b86068c69 -->|calls| e3484a9f_f8a5_4082_0208_641d58b965c3
  31503a99_436d_a6aa_9429_398a818a20a1["generateCodeFrame()"]
  f2d18c28_9782_02d0_c983_083b86068c69 -->|calls| 31503a99_436d_a6aa_9429_398a818a20a1
  d36a898a_2693_93f3_9d5a_3c914ee38d2e["tip()"]
  f2d18c28_9782_02d0_c983_083b86068c69 -->|calls| d36a898a_2693_93f3_9d5a_3c914ee38d2e
  b5f5fd56_650f_9060_16a6_225029566de4["createFunction()"]
  f2d18c28_9782_02d0_c983_083b86068c69 -->|calls| b5f5fd56_650f_9060_16a6_225029566de4
  style f2d18c28_9782_02d0_c983_083b86068c69 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

src/compiler/to-function.ts lines 21–119

export function createCompileToFunctionFn(compile: Function): Function {
  const cache = Object.create(null)

  return function compileToFunctions(
    template: string,
    options?: CompilerOptions,
    vm?: Component
  ): CompiledFunctionResult {
    options = extend({}, options)
    const warn = options.warn || baseWarn
    delete options.warn

    /* istanbul ignore if */
    if (__DEV__) {
      // detect possible CSP restriction
      try {
        new Function('return 1')
      } catch (e: any) {
        if (e.toString().match(/unsafe-eval|CSP/)) {
          warn(
            'It seems you are using the standalone build of Vue.js in an ' +
              'environment with Content Security Policy that prohibits unsafe-eval. ' +
              'The template compiler cannot work in this environment. Consider ' +
              'relaxing the policy to allow unsafe-eval or pre-compiling your ' +
              'templates into render functions.'
          )
        }
      }
    }

    // check cache
    const key = options.delimiters
      ? String(options.delimiters) + template
      : template
    if (cache[key]) {
      return cache[key]
    }

    // compile
    const compiled = compile(template, options)

    // check compilation errors/tips
    if (__DEV__) {
      if (compiled.errors && compiled.errors.length) {
        if (options.outputSourceRange) {
          compiled.errors.forEach(e => {
            warn(
              `Error compiling template:\n\n${e.msg}\n\n` +
                generateCodeFrame(template, e.start, e.end),
              vm
            )
          })
        } else {
          warn(
            `Error compiling template:\n\n${template}\n\n` +
              compiled.errors.map(e => `- ${e}`).join('\n') +
              '\n',
            vm
          )
        }
      }
      if (compiled.tips && compiled.tips.length) {
        if (options.outputSourceRange) {
          compiled.tips.forEach(e => tip(e.msg, vm))
        } else {
          compiled.tips.forEach(msg => tip(msg, vm))
        }
      }
    }

    // turn code into functions
    const res: any = {}
    const fnGenErrors: any[] = []
    res.render = createFunction(compiled.render, fnGenErrors)
    res.staticRenderFns = compiled.staticRenderFns.map(code => {
      return createFunction(code, fnGenErrors)
    })

    // check function generation errors.
    // this should only happen if there is a bug in the compiler itself.
    // mostly for codegen development use
    /* istanbul ignore if */
    if (__DEV__) {
      if ((!compiled.errors || !compiled.errors.length) && fnGenErrors.length) {
        warn(
          `Failed to generate render function:\n\n` +
            fnGenErrors
              .map(
                ({ err, code }) => `${(err as any).toString()} in\n\n${code}\n`
              )
              .join('\n'),
          vm
        )
      }
    }

    return (cache[key] = res)
  }
}