Skip to content

初始化项目

1. 使用工程化工具安装

pnpm create vue@latest

2. 通过CDN安装Vue

javascript
<script src="https://unpkg.com/vue@3/dist/vue.global.js"></script>

通过 CDN 使用 Vue 时,不涉及“构建步骤”。这使得设置更加简单, 并且可以用于增强静态的 HTML 或与后端框架集成。 但是,你将无法使用单文件组件 (SFC) 语法。

上面的链接使用了全局构建版本的 Vue,该版本的所有顶层 API 都以属性的形式暴露在了全局的 Vue 对象上。这里有一个使用全局构建版本的例子:

html
<script src="https://unpkg.com/vue@3/dist/vue.global.js"></script>

<div id="app">{{ message }}</div>

<script>
  const { createApp, ref } = Vue

  createApp({
    setup() {
      const message = ref('Hello vue!')
      return {
        message,
      }
    },
  }).mount('#app')
</script>