Vite创建的默认Vue3项目中package.json文件信息如下：
{
"name": "vmoudle1",
"private": true,
"version": "0.0.0",
"type": "module",
"scripts": {
"dev": "vite",
"build": "vite build",
"preview": "vite preview"
},
"dependencies": {
"vue": "^3.4.19"
},
"devDependencies": {
"@vitejs/plugin-vue": "^5.0.4",
"vite": "^5.1.4"
}
}
其中，存在npm 脚本
"scripts": {
"dev": "vite", // 启动开发服务器
"build": "vite build", // 为生产环境构建产物
"preview": "vite preview" // 本地预览生产构建产物
}
控制台运行npm脚本，启动项目。
npm run dev
页面如下。(为便于理解，我修改了项目)
查看index.html文件
<!doctype html>
<html lang="en">
<!--删除head标签中的内容-->
<body>
<div id="app"></div>
<script type="module" src="/src/main.js"></script>
</body>
</html>
这么点东西怎么能够显示上图页面呢？
解析：(附带项目结构)
