Nextjs 配置使用antd

Next.js中不能直接使用css，需要自己安装插件。

插件安装

yarn add @zeit/next-css antd  babel-plugin-import

配置文件的写入

next.config.js

const withCss = require('@zeit/next-css')

if(typeof require !== 'undefined'){
  require.extensions['.css']=file=>{}
}

module.exports = withCss({})

.babelrc

{
  "presets": [
    "next/babel"
  ],
  //  Next.js的总配置文件，相当于继承了它本身的所有配置
  "plugins": [
    //  增加新的插件，这个插件就是让antd可以按需引入，包括CSS

    [
      "import",
      {
        "libraryName": "antd",
     //"style":"css"   wenpack语法报错 引入css
      }
    ]
  ]
}

由于.babelrc文件 引入css语法会报错，所以在pages新建一个_app.js

import App from 'next/app'
import 'antd/dist/antd.css'
import '../static/style/pages/comm.css'

export default App