本框架是在官方发布的 homework0 的基础上进行简单修改得到的,对于官方提供的框架代码基本没有做任何的修改。
- 引入 npm 包管理(主要是为了减少手动管理 lib 包)
- 将之前的 /lib 文件夹删除(因为我们已经不需要手动引入这些包了,只需要通过npm去下载管理)
- 引入模块热更新能力(利用 vite 构建工具提供的能力)
- 将之前全局注册的模块更改为现在主流的 esm 模块 (正如你能在代码中看到的 import/export)
- 自动具备server能力,不需要同学再自己去配置安装各种静态 server,例如vscode 的 live-server、或者是自己用node或者python写的server,这些都不需要了。
- 热更新,理论上你的项目跑起来之后,修改任何源代码,浏览器都会自动更新。
- 更清晰的模块引用关系
- 安装nodejs(如果你没有安装)
- 安装 npm 包管理工具(通常安装完nodejs就自动安装了npm)
- 进入当前项目的文件夹运行
npm i
...安装完毕后
- 仍然在当前项目文件夹运行
npm run dev
...几秒钟后
在浏览器中访问 http://localhost:3000/
这时候你应该能看到本次作业所提供的作业框架对应的效果。
以上流程跑通之后,下一次再起项目就只需要运行第4步的 npm run dev
就可以了。