createCompileToFunctionFn() — vue Function Reference

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

Function typescript CompilerSFC ScriptCompiler calls 6 called by 1

Entity Profile

CompilerSFC→ ScriptCompiler→ createCompileToFunctionFn() — vue Function Reference

Dependency Diagram

graph TD
  c16a3cd4_68e6_1d49_ea28_e5acec70d6e2["createCompileToFunctionFn()"]
  da6f913d_df09_ab43_1296_7f19325c6a21["createCompilerCreator()"]
  da6f913d_df09_ab43_1296_7f19325c6a21 -->|calls| c16a3cd4_68e6_1d49_ea28_e5acec70d6e2
  133969d0_a7bd_f1c5_46a3_9fb8fd249583["extend()"]
  c16a3cd4_68e6_1d49_ea28_e5acec70d6e2 -->|calls| 133969d0_a7bd_f1c5_46a3_9fb8fd249583
  c7fb0b96_a593_dfb8_3f7a_2f40701511a4["toString()"]
  c16a3cd4_68e6_1d49_ea28_e5acec70d6e2 -->|calls| c7fb0b96_a593_dfb8_3f7a_2f40701511a4
  a8c8f192_fd2d_dbe3_46ed_dd8fabebc429["warn()"]
  c16a3cd4_68e6_1d49_ea28_e5acec70d6e2 -->|calls| a8c8f192_fd2d_dbe3_46ed_dd8fabebc429
  eb367a79_758d_d887_b761_550177f27249["generateCodeFrame()"]
  c16a3cd4_68e6_1d49_ea28_e5acec70d6e2 -->|calls| eb367a79_758d_d887_b761_550177f27249
  1a4ad478_cd48_ed8b_e68e_03c90d305dcc["tip()"]
  c16a3cd4_68e6_1d49_ea28_e5acec70d6e2 -->|calls| 1a4ad478_cd48_ed8b_e68e_03c90d305dcc
  a714a60c_5fc0_3d82_0e55_b4ae2aa4eae2["createFunction()"]
  c16a3cd4_68e6_1d49_ea28_e5acec70d6e2 -->|calls| a714a60c_5fc0_3d82_0e55_b4ae2aa4eae2
  style c16a3cd4_68e6_1d49_ea28_e5acec70d6e2 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)
  }
}