需要先安装@zeit/next-css 不然不能识别css文件
然后根目录下创建next.config.js进行配置
const withCss = require('@zeit/next-css')
if(typeof require !== 'undefined'){
require.extensions['.css']=file=>{}
}
module.exports = withCss({})
再安装antd
npm i --s antd
再安装babel-plugin-import
npm i --s babel-plugin-import
再在根目录下创建.babelrc
{
"presets":["next/babel"], //Next.js的总配置文件,相当于继承了它本身的所有配置
"plugins":[ //增加新的插件,这个插件就是让antd可以按需引入,包括CSS
[
"import",
{
"libraryName":"antd"
}
]
]
}
然后在page中创建或修改_app.js
import App from 'next/app'
import 'antd/dist/antd.css'
export default App
接下来就可以在页面中按需引入了
import {Button} from 'antd'