在 Next.js 中使用Ant Design
安装和初始化
npx create-next-app antd-demo
工具会自动初始化一个脚手架并安装项目的各种必要依赖，在安装过程中，有一些配置项需要自行选择，如果在过程中出现网络问题，请尝试配置代理，或使用其他 npm registry，例如，你可以切换到淘宝镜像源：npm config set registry https://registry.npmmirror.com。
初始化完成后，我们进入项目并启动。
cd antd-demo npm run dev
npm run dev
此时使用浏览器访问 http://localhost:3000/ ，看到 NEXT 的 logo 就算成功了。
引入 antd
npm install antd --save
修改 src/app/page.tsx，引入 antd 的按钮组件。
import { Button } from 'antd';
const Home = () => ( <div className="App"> <Button type="primary">Button</Button> </div> );
export default Home;
好了，现在你应该能看到页面上已经有了 antd 的蓝色按钮组件，接下来就可以继续选用其他组件开发应用了。
项目目录结构
项目目录结构如下图所示：
