These code snippets don't match their description
Description of Problem
The document says 'When using Vue without a build step' under the section 'In-DOM Root Component Template'. But the first line in the js code snippet seems to require a build step such as Vite?
import { createApp } from 'vue'
Since the module name 'vue' doesn't start with a path sign, the code snippet should require a build step such as Vite. (Reference)
Proposed Solution
Therefore, I edited these two code snippets with reference to the section 'Without Build Tools' in the article 'Quick Start' in Vue documentation. I think my edit is proper for documentation readers regards the consistence.
Additional Information
By the way, I am also a Vue beginner. Let me know if I am wrong. See also.
Deploy Preview for vuejs ready!
| Name | Link |
|---|---|
| Latest commit | 59503d860276ff68fcad9efe248e6ee93fd943e7 |
| Latest deploy log | https://app.netlify.com/sites/vuejs/deploys/62e129262733a900098c6fb1 |
| Deploy Preview | https://deploy-preview-1864--vuejs.netlify.app |
| Preview on mobile | Toggle QR Code...Use your smartphone camera to open QR code link. |
To edit notification comments on pull requests, go to your Netlify site settings.
Thanks for the PR!
I believe the current use of an import is intentional. It's assuming that you're using an import map, as introduced in https://vuejs.org/guide/quick-start.html#without-build-tools. I can see that as being potentially confusing, though.
I'm not sure that section in application.md needs to say 'without a build step'. Using an in-DOM template isn't limited to applications without a build step. Instead I think it should probably mention that it requires a build of Vue that supports template compilation at runtime.
Thoughts?
I believe the current use of an import is intentional.
Yes. I know the solution of importmap, this feature is mentioned in 'Quick Start', too. With importmap, the code import { createApp } from 'vue' can run up without error.
The section description is correct technically, while it's a bit confusing for Vue learners, maybe. I think we could consider editing the article to make it clearer.
Using an in-DOM template isn't limited to applications without a build step.
Please excuse my lack of understanding on the term 'in-DOM template'. Does it refer to writing Vue project in plain HTML, as opposed to SFC? (Reference) That's to say the build step such as Vite and Webpack can be used in plain HTML? (I'm sorry that I don't understand much about bundler)
Instead I think it should probably mention that it requires a build of Vue that supports template compilation at runtime.
Do you know which Vue build supports this feature?
I've reworded this section in #2332 to try to make it a bit clearer.
Thanks again for pointing out this problem.