idea创建npm的vite vue
时间: 2023-10-04 22:09:50 浏览: 95
npm基于vite制作自己的npm包+ts超详细
1. 首先,需要在本地安装Node.js和npm。
2. 在命令行中输入以下命令,创建一个新的npm项目:
```
npm init
```
3. 安装vite和vue:
```
npm install vite vue --save-dev
```
4. 在项目根目录下创建一个index.html文件,并添加以下内容:
```html
<!DOCTYPE html>
<html>
<head>
<title>My Vite Vue App</title>
</head>
<body>
<div id="app"></div>
<script type="module">
import { createApp } from 'vue'
import App from './App.vue'
createApp(App).mount('#app')
</script>
</body>
</html>
```
5. 在src目录下创建一个App.vue文件,作为Vue应用的根组件,并添加以下内容:
```vue
<template>
<div>
<h1>Hello Vite Vue!</h1>
</div>
</template>
<script>
export default {
name: 'App'
}
</script>
```
6. 在命令行中运行以下命令,启动vite开发服务器:
```
npx vite
```
7. 在浏览器中打开http://localhost:3000,即可看到Vue应用的页面。
阅读全文