1. 安装 Node.js 和 npm
确保你的系统中安装了 [Node.js](https://nodejs.org/) 和 [npm](https://www.npmjs.com/)。Vue.js 3 需要使用 npm 进行依赖管理。
2. 安装 Vue CLI
打开终端（命令行界面）并运行以下命令全局安装 Vue CLI：
npm install -g @vue/cli
3. 创建一个新的 Vue 3 项目
在终端中运行以下命令，使用 Vue CLI 创建一个新的 Vue 3 项目：
vue create my-vue3-app
按照提示选择默认配置或手动配置，确保选择 Vue 3 版本。
4. 进入项目目录
进入你刚刚创建的项目目录：
cd my-vue3-app
5. 启动本地开发服务器
运行以下命令启动本地开发服务器：
npm run serve
这将启动开发服务器，并在浏览器中预览你的 Vue 3 应用。访问 [http://localhost:8080](http://localhost:8080)（或其他端口号，具体取决于你的配置）来查看应用。
6. 编写你的第一个 Vue 3 组件
打开 src 目录下的 App.vue 文件，这是根组件。在文件中清空默认内容，然后编写一个简单的 Vue 3 组件：
<template>
<div>
<h1>{{ message }}</h1>
</div>
</template>
<script>
export default {
data() {
return {
message: 'Hello, Vue 3!'
};
}
};
</script>
<style>
h1 {
color: #42b983;
}
</style>
7. 查看效果
在浏览器中访问 [http://localhost:8080](http://localhost:8080)，你将看到显示 "Hello, Vue 3!" 的页面。这是你的第一个 Vue 3 应用。
这只是一个简单的起步示例，你可以继续学习 Vue.js 3 的其他概念，如组件、路由、状态管理等，以构建更复杂的应用。Vue 3 的[官方文档](https://v3.vuejs.org/)是一个非常好的学习资源，提供了详细的教程和文档。
转载请注明出处：http://www.zyzy.cn/article/detail/12974/Vue3