react引入Ant Design

需要先安装@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'