feat(reactivity-transform): rename @vue/ref-transform to @vue/reactivity-transform

diff --git a/.eslintrc.js b/.eslintrc.js
index ea44a000114986215f9a5888dc7aed685f523146..4c667f90216ebcebb96e020be9495a88fe7c65c9 100644 (file)
--- a/.eslintrc.js
+++ b/.eslintrc.js
@@ -50,7 +50,7 @@ module.exports = {
     // Packages targeting Node
     {
       files: [
-        'packages/{compiler-sfc,compiler-ssr,server-renderer,ref-transform}/**'
+        'packages/{compiler-sfc,compiler-ssr,server-renderer,reactivity-transform}/**'
       ],
       rules: {
         'no-restricted-globals': ['error', ...DOMGlobals],

diff --git a/packages/compiler-sfc/__tests__/compileScriptRefTransform.spec.ts b/packages/compiler-sfc/__tests__/compileScriptRefTransform.spec.ts
index d2f52589003e72adb4d118025258e4a9ec98a4b3..f6897b8038d8795a249c054d55dbf0f5bcb9c0f8 100644 (file)
--- a/packages/compiler-sfc/__tests__/compileScriptRefTransform.spec.ts
+++ b/packages/compiler-sfc/__tests__/compileScriptRefTransform.spec.ts
@@ -2,7 +2,7 @@ import { BindingTypes } from '@vue/compiler-core'
 import { compileSFCScript as compile, assertCode } from './utils'
 
 // this file only tests integration with SFC - main test case for the ref
-// transform can be found in <root>/packages/ref-transform/__tests__
+// transform can be found in <root>/packages/reactivity-transform/__tests__
 describe('sfc ref transform', () => {
   function compileWithRefTransform(src: string) {
     return compile(src, { refTransform: true })

diff --git a/packages/compiler-sfc/package.json b/packages/compiler-sfc/package.json
index 7cf10ddf2a9d11a041996ce01a325e6e2ebbe5ba..344fe77930991f7aa23f4da6f1beca85b2bdb3e4 100644 (file)
--- a/packages/compiler-sfc/package.json
+++ b/packages/compiler-sfc/package.json
@@ -36,7 +36,7 @@
     "@vue/compiler-core": "3.2.24",
     "@vue/compiler-dom": "3.2.24",
     "@vue/compiler-ssr": "3.2.24",
-    "@vue/ref-transform": "3.2.24",
+    "@vue/reactivity-transform": "3.2.24",
     "@vue/shared": "3.2.24",
     "estree-walker": "^2.0.2",
     "magic-string": "^0.25.7",

diff --git a/packages/compiler-sfc/src/compileScript.ts b/packages/compiler-sfc/src/compileScript.ts
index 1823d28cba6a05ee83a519b004a48a599b230810..9aa108118fdcdab676278f0d1e59d1a74c7db766 100644 (file)
--- a/packages/compiler-sfc/src/compileScript.ts
+++ b/packages/compiler-sfc/src/compileScript.ts
@@ -51,7 +51,7 @@ import { createCache } from './cache'
 import {
   shouldTransform as shouldTransformRef,
   transformAST as transformRefAST
-} from '@vue/ref-transform'
+} from '@vue/reactivity-transform'
 
 // Special compiler macros
 const DEFINE_PROPS = 'defineProps'

diff --git a/packages/compiler-sfc/src/index.ts b/packages/compiler-sfc/src/index.ts
index 1c4bb14ee6f33fdfcf447bd452d9d1486d979be2..245aa461901598b7f26982be38a3de33fadd8a56 100644 (file)
--- a/packages/compiler-sfc/src/index.ts
+++ b/packages/compiler-sfc/src/index.ts
@@ -8,7 +8,7 @@ export {
   shouldTransform as shouldTransformRef,
   transform as transformRef,
   transformAST as transformRefAST
-} from '@vue/ref-transform'
+} from '@vue/reactivity-transform'
 
 // Utilities
 export { parse as babelParse } from '@babel/parser'

diff --git a/packages/ref-transform/README.md b/packages/reactivity-transform/README.md
similarity index 62%
rename from packages/ref-transform/README.md
rename to packages/reactivity-transform/README.md
index 33948af37aa392a8e609aebfd03c64fa591a5356..92277a8b288d44066b646640f9ba2fcd09673017 100644 (file)
--- a/packages/ref-transform/README.md
+++ b/packages/reactivity-transform/README.md
@@ -1,4 +1,4 @@
-# @vue/ref-transform
+# @vue/reactivity-transform
 
 > ⚠️ This is experimental and currently only provided for testing and feedback. It may break during patches or even be removed. Use at your own risk!
 >
@@ -6,32 +6,50 @@
 
 ## Basic Rules
 
-- `$()` to turn refs into reactive variables
-- `$$()` to access the original refs from reactive variables
+- Ref-creating APIs have `$`-prefixed versions that create reactive variables instead. They also do not need to be explicitly imported. These include:
+  - `ref`
+  - `computed`
+  - `shallowRef`
+  - `customRef`
+  - `toRef`
+- `$()` can be used to destructure an object into reactive variables, or turn existing refs into reactive variables
+- `$$()` to "escape" the transform, which allows access to underlying refs
 
 ```js
-import { ref, watch } from 'vue'
+import { watchEffect } from 'vue'
 
 // bind ref as a variable
-let count = $(ref(0))
+let count = $ref(0)
 
-// no need for .value
-console.log(count)
-
-// get the actual ref
-watch($$(count), c => console.log(`count changed to ${c}`))
+watchEffect(() => {
+  // no need for .value
+  console.log(count)
+})
 
 // assignments are reactive
 count++
+
+// get the actual ref
+console.log($$(count)) // { value: 1 }
+```
+
+Macros can be optionally imported to make it more explicit:
+
+```js
+// not necessary, but also works
+import { $, $ref } from 'vue/macros'
+
+let count = $ref(0)
+const { x, y } = $(useMouse())
 ```
 
-### Shorthands
+### Global Types
 
-A few commonly used APIs have shorthands (which also removes the need to import them):
+To enable types for the macros globally, include the following in a `.d.ts` file:
 
-- `$(ref(0))` -> `$ref(0)`
-- `$(computed(() => 123))` -> `$computed(() => 123)`
-- `$(shallowRef({}))` -> `$shallowRef({})`
+```ts
+/// <reference types="vue/macros-global" />
+```
 
 ## API
 
@@ -42,7 +60,7 @@ This package is the lower-level transform that can be used standalone. Higher-le
 Can be used to do a cheap check to determine whether full transform should be performed.
 
 ```js
-import { shouldTransform } from '@vue/ref-transform'
+import { shouldTransform } from '@vue/reactivity-transform'
 
 shouldTransform(`let a = ref(0)`) // false
 shouldTransform(`let a = $ref(0)`) // true
@@ -51,7 +69,7 @@ shouldTransform(`let a = $ref(0)`) // true
 ### `transform`
 
 ```js
-import { transform } from '@vue/ref-transform'
+import { transform } from '@vue/reactivity-transform'
 
 const src = `let a = $ref(0); a++`
 const {
@@ -86,7 +104,7 @@ interface RefTransformOptions {
 Transform with an existing Babel AST + MagicString instance. This is used internally by `@vue/compiler-sfc` to avoid double parse/transform cost.
 
 ```js
-import { transformAST } from '@vue/ref-transform'
+import { transformAST } from '@vue/reactivity-transform'
 import { parse } from '@babel/parser'
 import MagicString from 'magic-string'
 

diff --git a/packages/ref-transform/__tests__/__snapshots__/refTransform.spec.ts.snap b/packages/reactivity-transform/__tests__/__snapshots__/refTransform.spec.ts.snap
similarity index 100%
rename from packages/ref-transform/__tests__/__snapshots__/refTransform.spec.ts.snap
rename to packages/reactivity-transform/__tests__/__snapshots__/refTransform.spec.ts.snap

diff --git a/packages/ref-transform/__tests__/refTransform.spec.ts b/packages/reactivity-transform/__tests__/refTransform.spec.ts
similarity index 100%
rename from packages/ref-transform/__tests__/refTransform.spec.ts
rename to packages/reactivity-transform/__tests__/refTransform.spec.ts

diff --git a/packages/ref-transform/api-extractor.json b/packages/reactivity-transform/api-extractor.json
similarity index 100%
rename from packages/ref-transform/api-extractor.json
rename to packages/reactivity-transform/api-extractor.json

diff --git a/packages/ref-transform/package.json b/packages/reactivity-transform/package.json
similarity index 72%
rename from packages/ref-transform/package.json
rename to packages/reactivity-transform/package.json
index 50c832c583d701b666e695b429b40b066fa28f25..48c7179f57eb0be4c6d579c9eb605c7a9ce46d13 100644 (file)
--- a/packages/ref-transform/package.json
+++ b/packages/reactivity-transform/package.json
@@ -1,8 +1,8 @@
 {
-  "name": "@vue/ref-transform",
+  "name": "@vue/reactivity-transform",
   "version": "3.2.24",
-  "description": "@vue/ref-transform",
-  "main": "dist/ref-transform.cjs.js",
+  "description": "@vue/reactivity-transform",
+  "main": "dist/reactivity-transform.cjs.js",
   "files": [
     "dist"
   ],
@@ -12,11 +12,11 @@
     ],
     "prod": false
   },
-  "types": "dist/ref-transform.d.ts",
+  "types": "dist/reactivity-transform.d.ts",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/vuejs/vue-next.git",
-    "directory": "packages/ref-transform"
+    "directory": "packages/reactivity-transform"
   },
   "keywords": [
     "vue"
@@ -26,7 +26,7 @@
   "bugs": {
     "url": "https://github.com/vuejs/vue-next/issues"
   },
-  "homepage": "https://github.com/vuejs/vue-next/tree/dev/packages/ref-transform#readme",
+  "homepage": "https://github.com/vuejs/vue-next/tree/dev/packages/reactivity-transform#readme",
   "dependencies": {
     "@babel/parser": "^7.15.0",
     "@vue/compiler-core": "3.2.24",

diff --git a/packages/ref-transform/src/babelPlugin.ts b/packages/reactivity-transform/src/babelPlugin.ts
similarity index 100%
rename from packages/ref-transform/src/babelPlugin.ts
rename to packages/reactivity-transform/src/babelPlugin.ts

diff --git a/packages/ref-transform/src/index.ts b/packages/reactivity-transform/src/index.ts
similarity index 100%
rename from packages/ref-transform/src/index.ts
rename to packages/reactivity-transform/src/index.ts

diff --git a/packages/ref-transform/src/refTransform.ts b/packages/reactivity-transform/src/refTransform.ts
similarity index 100%
rename from packages/ref-transform/src/refTransform.ts
rename to packages/reactivity-transform/src/refTransform.ts

diff --git a/test-dts/refTransformMacros.test-d.ts b/test-dts/reactivityMacros.test-d.ts
similarity index 100%
rename from test-dts/refTransformMacros.test-d.ts
rename to test-dts/reactivityMacros.test-d.ts