actuallyCompile() — vue Function Reference

Architecture documentation for the actuallyCompile() function in compileTemplate.ts from the vue codebase.

Function typescript CompilerSFC ScriptCompiler calls 1 called by 1

Entity Profile

CompilerSFC→ ScriptCompiler→ actuallyCompile() — vue Function Reference

Dependency Diagram

graph TD
  d97c3715_d6ea_cb5a_f615_2a6156a68d87["actuallyCompile()"]
  e30b3e14_d8fc_b1f3_10ef_3add53029405["compileTemplate()"]
  e30b3e14_d8fc_b1f3_10ef_3add53029405 -->|calls| d97c3715_d6ea_cb5a_f615_2a6156a68d87
  daf5feaa_5661_e63c_80fa_09f5265e529c["prefixIdentifiers()"]
  d97c3715_d6ea_cb5a_f615_2a6156a68d87 -->|calls| daf5feaa_5661_e63c_80fa_09f5265e529c
  style d97c3715_d6ea_cb5a_f615_2a6156a68d87 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

packages/compiler-sfc/src/compileTemplate.ts lines 97–205

function actuallyCompile(
  options: SFCTemplateCompileOptions
): SFCTemplateCompileResults {
  const {
    source,
    compiler = _compiler,
    compilerOptions = {},
    transpileOptions = {},
    transformAssetUrls,
    transformAssetUrlsOptions,
    isProduction = process.env.NODE_ENV === 'production',
    isFunctional = false,
    optimizeSSR = false,
    prettify = true,
    isTS = false,
    bindings
  } = options

  const compile =
    optimizeSSR && compiler.ssrCompile ? compiler.ssrCompile : compiler.compile

  let finalCompilerOptions = compilerOptions
  if (transformAssetUrls) {
    const builtInModules = [
      transformAssetUrls === true
        ? assetUrlsModule(undefined, transformAssetUrlsOptions)
        : assetUrlsModule(transformAssetUrls, transformAssetUrlsOptions),
      srcsetModule(transformAssetUrlsOptions)
    ]
    finalCompilerOptions = Object.assign({}, compilerOptions, {
      modules: [...builtInModules, ...(compilerOptions.modules || [])],
      filename: options.filename
    })
  }
  finalCompilerOptions.bindings = bindings

  const { ast, render, staticRenderFns, tips, errors } = compile(
    source,
    finalCompilerOptions
  )

  if (errors && errors.length) {
    return {
      ast,
      code: `var render = function () {}\n` + `var staticRenderFns = []\n`,
      source,
      tips,
      errors
    }
  } else {
    // stripping `with` usage
    let code =
      `var __render__ = ${prefixIdentifiers(
        `function render(${isFunctional ? `_c,_vm` : ``}){${render}\n}`,
        isFunctional,
        isTS,
        transpileOptions,
        bindings
      )}\n` +
      `var __staticRenderFns__ = [${staticRenderFns.map(code =>
        prefixIdentifiers(
          `function (${isFunctional ? `_c,_vm` : ``}){${code}\n}`,
          isFunctional,
          isTS,
          transpileOptions,
          bindings
        )
      )}]` +
      `\n`

    // #23 we use __render__ to avoid `render` not being prefixed by the
    // transpiler when stripping with, but revert it back to `render` to
    // maintain backwards compat
    code = code.replace(/\s__(render|staticRenderFns)__\s/g, ' $1 ')

    if (!isProduction) {
      // mark with stripped (this enables Vue to use correct runtime proxy
      // detection)
      code += `render._withStripped = true`

      if (prettify) {
        try {
          code = require('prettier').format(code, {
            semi: false,
            parser: 'babel'
          })
        } catch (e: any) {
          if (e.code === 'MODULE_NOT_FOUND') {
            tips.push(
              'The `prettify` option is on, but the dependency `prettier` is not found.\n' +
                'Please either turn off `prettify` or manually install `prettier`.'
            )
          }
          tips.push(
            `Failed to prettify component ${options.filename} template source after compilation.`
          )
        }
      }
    }

    return {
      ast,
      code,
      source,
      tips,
      errors
    }
  }
}