如何搭建开发环境

[cssmagic]

准备工作

1. 获取本项目的最新代码。
2. 在项目根目录执行 npm install，安装必要的依赖。

Demo 页面

为便于开发，我们为 demo 页面设置了两种模式：“开发模式” 和 “生产模式”。

在这两种模式下，demo 页面加载的资源是不同的（具体行为可参见 demo/index.html 源码）。本文档只关心 “开发模式”。

文件监听与自动刷新

在项目根目录执行 npm run watch，作用如下：

• 此命令将持续监听源码的变更，并自动重新编译 demo 页面在 “开发模式” 下所需的 JS 和 CSS 文件。

• 此命令还将启动 BrowserSync，访问 http://localhost:3098/ 即获得自动刷新效果——当 Nasa.js 源码或 demo 页面的相关源码变更时，demo 页面会自动刷新（或自动更新样式）。

按 Ctrl + C 可中止此服务。

---

附：端口配置

开发环境默认使用 8888 和 3098 这两个端口。如果这两个端口与其它应用冲突，请按以下步骤修改端口：

1. 把 .env.example 复制一份，命名为 .env。

2. 修改 .env 文件，把两处端口配置改为空闲的其它端口。

3. 中止并重新执行 npm run watch 命令。