在 Vue.js 3 中,你可以使用不同的方式来安装 Vue,这取决于你的项目需求和构建工具的选择。以下是两种常见的安装方式:

1. CDN 引入

在 HTML 文件中使用 CDN 引入 Vue.js 3:
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Vue 3</title>
  <!-- 引入 Vue.js 3 的 CDN 链接 -->
  <script src="https://cdn.jsdelivr.net/npm/vue@next"></script>
</head>
<body>
  <div id="app">
    {{ message }}
  </div>

  <script>
    const app = Vue.createApp({
      data() {
        return {
          message: 'Hello, Vue 3!'
        };
      }
    });

    app.mount('#app');
  </script>
</body>
</html>

2. 使用 npm 安装

在使用 npm 进行安装时,首先确保你的项目中已经安装了 Node.js。然后,使用以下命令安装 Vue:
npm install vue@next

在你的项目中使用 Vue:
// 在你的 JavaScript 文件中引入 Vue
import { createApp } from 'vue';

// 创建一个 Vue 实例
const app = createApp({
  data() {
    return {
      message: 'Hello, Vue 3!'
    };
  }
});

// 挂载 Vue 实例到指定的元素
app.mount('#app');

上述两种方式都是安装 Vue.js 3 的有效方式,你可以根据项目需求选择合适的方式。当然,如果使用的是构建工具(比如 Vue CLI),它会为你处理所有的依赖关系和配置,你只需专注于编写 Vue 代码即可。


转载请注明出处:http://www.zyzy.cn/article/detail/12970/Vue3