npm init vite-app my-app
cd my-app
npm install
这将创建一个名为 my-app
的新项目,并使用 Vite 初始化项目。
npm install vue@next
<template>
<div>
<h1>{{ message }}</h1>
</div>
</template>
<script>
export default {
name: 'App',
data() {
return {
message: 'Hello, world!'
}
}
}
</script>
import { createApp } from 'vue'
import App from './App.vue'
createApp(App).mount('#app')
以上就是在 Vite 中搭建 Vue 3 项目的步骤,希望对你有帮助!
-
以下是在 Vite 中搭建 Vue 3 项目的步骤:
-
安装 Node.js 确保已安装 Node.js。你可以在 Node.js 官网 https://nodejs.org/ 下载最新版本的 Node.js 安装包。
-
初始化项目 在终端中执行以下命令:
- 安装 Vue 3 进入项目目录,执行以下命令安装 Vue 3:
- 创建一个 Vue 组件 在
src
目录下创建一个名为App.vue
的文件,并添加以下代码: - 在
main.js
中导入并渲染组件 在src
目录下创建一个名为main.js
的文件,并添加以下代码: - 运行项目 在终端执行以下命令启动开发服务器:
以下是在 Vite 中搭建 Vue 3 项目的步骤:
安装 Node.js 确保已安装 Node.js。你可以在 Node.js 官网 https://nodejs.org/ 下载最新版本的 Node.js 安装包。
初始化项目 在终端中执行以下命令:
npm init vite-app my-app
cd my-app
npm install
这将创建一个名为 my-app
的新项目,并使用 Vite 初始化项目。
npm install vue@next
<template>
<div>
<h1>{{ message }}</h1>
</div>
</template>
<script>
export default {
name: 'App',
data() {
return {
message: 'Hello, world!'
}
}
}
</script>
import { createApp } from 'vue'
import App from './App.vue'
createApp(App).mount('#app')
以上就是在 Vite 中搭建 Vue 3 项目的步骤,希望对你有帮助!
npm run dev
此时你就可以在浏览器中访问 http://localhost:3000 来查看你的 Vue 3 项目了。
npm run dev
此时你就可以在浏览器中访问 http://localhost:3000 来查看你的 Vue 3 项目了。
- 安装 Vue 3 进入项目目录,执行以下命令安装 Vue 3:
- 创建一个 Vue 组件 在
src
目录下创建一个名为App.vue
的文件,并添加以下代码: - 在
main.js
中导入并渲染组件 在src
目录下创建一个名为main.js
的文件,并添加以下代码: - 运行项目 在终端执行以下命令启动开发服务器: