npm init -y
由此生成package.json文件。
npm install vite -D
安装成功后会在package.json文件中添加以下内容:
"devDependencies": {
"vite": "^3.1.6"
}
npm install vue
安装成功后会在package.json文件中添加以下内容:
"dependencies": {
"vue": "^3.2.40"
}
npm install @vitejs/plugin-vue -D
import { defineConfig} from "vite";
import Vue from '@vitejs/plugin-vue'
export default defineConfig({
plugins: [Vue()]
})
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<title>Vite + Vue</title>
</head>
<body>
<script type="module" src="src/mAIn.js"></script>
</body>
</html>
import { createApp } from "vue";
import App from "./App.vue";
createApp(App).mount('#app')
<template>
<h1>Hello Vite + Vue!</h1>
</template>
<script>
export default {
name: "App"
}
</script>
<style scoped>
</style>
第9步. package.json文件中添加以下内容:
"scripts": {
"dev": "vite"
}
npm run dev