createReadonly() — vue Function Reference

Architecture documentation for the createReadonly() function in readonly.ts from the vue codebase.

Function typescript CompilerSFC StyleProcessor calls 5 called by 2

Entity Profile

CompilerSFC→ StyleProcessor→ createReadonly() — vue Function Reference

Dependency Diagram

graph TD
  570658a0_90e9_3496_213a_7280821a5a99["createReadonly()"]
  0c0a6db0_d081_921f_5fe2_f51407664b15["readonly.ts"]
  570658a0_90e9_3496_213a_7280821a5a99 -->|defined in| 0c0a6db0_d081_921f_5fe2_f51407664b15
  6805952a_0946_d29b_2a2d_94905f439fe7["readonly()"]
  6805952a_0946_d29b_2a2d_94905f439fe7 -->|calls| 570658a0_90e9_3496_213a_7280821a5a99
  49fe5e94_ca63_20f7_3f17_a5990fd207e7["shallowReadonly()"]
  49fe5e94_ca63_20f7_3f17_a5990fd207e7 -->|calls| 570658a0_90e9_3496_213a_7280821a5a99
  17645efb_66ee_96d8_ce0d_83b1eee19e3e["isCollectionType()"]
  570658a0_90e9_3496_213a_7280821a5a99 -->|calls| 17645efb_66ee_96d8_ce0d_83b1eee19e3e
  9243ce8a_d877_78fa_a26d_a35d289a1277["isReadonly()"]
  570658a0_90e9_3496_213a_7280821a5a99 -->|calls| 9243ce8a_d877_78fa_a26d_a35d289a1277
  64ef09a1_8484_35c7_6154_30d045c3ca15["isRef()"]
  570658a0_90e9_3496_213a_7280821a5a99 -->|calls| 64ef09a1_8484_35c7_6154_30d045c3ca15
  4dec4402_504f_d778_cdf1_34adb751a2fb["isShallow()"]
  570658a0_90e9_3496_213a_7280821a5a99 -->|calls| 4dec4402_504f_d778_cdf1_34adb751a2fb
  7d2efa66_861c_4ad0_54da_425de619e09d["defineReadonlyProperty()"]
  570658a0_90e9_3496_213a_7280821a5a99 -->|calls| 7d2efa66_861c_4ad0_54da_425de619e09d
  style 570658a0_90e9_3496_213a_7280821a5a99 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

src/v3/reactivity/readonly.ts lines 44–97

function createReadonly(target: any, shallow: boolean) {
  if (!isPlainObject(target)) {
    if (__DEV__) {
      if (isArray(target)) {
        warn(`Vue 2 does not support readonly arrays.`)
      } else if (isCollectionType(target)) {
        warn(
          `Vue 2 does not support readonly collection types such as Map or Set.`
        )
      } else {
        warn(`value cannot be made readonly: ${typeof target}`)
      }
    }
    return target as any
  }

  if (__DEV__ && !Object.isExtensible(target)) {
    warn(
      `Vue 2 does not support creating readonly proxy for non-extensible object.`
    )
  }

  // already a readonly object
  if (isReadonly(target)) {
    return target as any
  }

  // already has a readonly proxy
  const existingFlag = shallow ? rawToShallowReadonlyFlag : rawToReadonlyFlag
  const existingProxy = target[existingFlag]
  if (existingProxy) {
    return existingProxy
  }

  const proxy = Object.create(Object.getPrototypeOf(target))
  def(target, existingFlag, proxy)

  def(proxy, ReactiveFlags.IS_READONLY, true)
  def(proxy, ReactiveFlags.RAW, target)

  if (isRef(target)) {
    def(proxy, RefFlag, true)
  }
  if (shallow || isShallow(target)) {
    def(proxy, ReactiveFlags.IS_SHALLOW, true)
  }

  const keys = Object.keys(target)
  for (let i = 0; i < keys.length; i++) {
    defineReadonlyProperty(proxy, target, keys[i], shallow)
  }

  return proxy as any
}