Correct binding type of msg cannot be properly inferred, which leads to compiler generating unref(msg), which in turn has runtime cost.
In addition to that, extra build step is needed to properly auto-import the ref.
A better approach would be to add a ref/computed/etc. vue-specific imports whenever their usage is detected. It is much cheaper and more beneficial to do so in the SFC compiler than in any other tool.
Steps:
[ ] Detect stray known symbols usage. This can happen during regular transform pass;
[ ] Inject non-prefixed imports (e.g. import { ref } from 'vue' instead of ref as _ref);
[ ] Respect user-defined imports (e.g. import { ref } from './custom-path' should not auto-import).
Writing SFCs using the default JS compiler and https://github.com/unplugin/unplugin-auto-import produces not-so-optimal code.
Take this for example (playground):
Correct binding type of
msg
cannot be properly inferred, which leads to compiler generatingunref(msg)
, which in turn has runtime cost. In addition to that, extra build step is needed to properly auto-import theref
.A better approach would be to add a
ref
/computed
/etc. vue-specific imports whenever their usage is detected. It is much cheaper and more beneficial to do so in the SFC compiler than in any other tool.Steps:
import { ref } from 'vue'
instead ofref as _ref
);import { ref } from './custom-path'
should not auto-import).