配置Antd+nextjs按需加載

# antd配置按需加載，
antd官方教程:https://ant.design/docs/react/introduce-cn
注意：antd 默認支持基於 ES module 的 tree shaking，不使用以下插件也會有按需加載的效果。
1. babel 插件

~~~yarn
yarn add babel-plugin-import
~~~

2. 配置.babelrc

1. 普通配置
~~~jsoon
// .babelrc or babel-loader option
{
"plugins": [
["import", {
"libraryName": "antd",
"libraryDirectory": "es",
"style": "css" // `style: true` 會加載 less 文件
}]
]
}
~~~

2.next babel配置
~~~json
{
"presets":["next/babel"], //Next.js的總配置文件，相當於繼承了它本身的所有配置
"plugins":[ //增加新的插件，這個插件就是讓antd可以按需引入，包括CSS
[
"import",
{
"libraryName":"antd",
"style":"css"
}
]
]
}
~~~

## CSS配置

1. 安裝nextt插件

~~~yarn
yarn add @zeit/next-css
~~~
2. 創建 next.config.js
~~~JSON
const withCss = require('@zeit/next-css')

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

module.exports = withCss({})
~~~