參考文檔： jspang.com/detailed?id…
1：搭建next開發環境
npx create-next-app blog
複制代碼 2：進入blog目錄
cd blog
複制代碼 3：使用yarn測試
yarn dev
複制代碼 如果能夠進入到下面的界面，說明前三步已經成功了！
4：加載antd
yarn add antd
複制代碼 5：在pages目錄下建立_app.js檔案，并寫入下列内容
import App from 'next/app'
import 'antd/dist/antd.css'
export default App
複制代碼 6：引入Button元件
import React from 'react'
import Head from 'next/head'
import {Button} from 'antd'
const Home = () => (
<>
<Head>
<title>Home</title>
</Head>
<div><Button>我是按鈕</Button></div>
</>
)
export default Home
複制代碼 7：測試實作效果
出現下面的效果，表示前台環境搭建成功！
![Hadoop之YARN[圖]](data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACwAAAAAAQABAAACAkQBADs=)