I tried to make the example a bit more descriptive. I changed `publicPath` in `now.config.js` to be `/_next/static/`, in place of `./`, and `outputPath` to `static/` in place of `static/css/`. The reason is that the webpack config will still fallback to `file-loader` for any content that is imported by the user and which is bigger that `8192` bytes. I think this content should not land in the css folder, which should probably stay css specific.
Moreover, for user content, like regular images, the former settings will fail.
If you have this:
```javascript
import LargeFile from './LargeFile.png'
```
it would be placed in `static/css/` but its url would resolve to `<base-url>/LargeFile.png`, which will fail. It works for semantic-ui alone, because `@zeit/next-css` will put the styles in `static/css/` and so `publicPath` of `./` would work just fine.
Putting assets in `static/` and setting `publicPath` to '/_next/static/' will resolve correctly for both semantic-ui related assets as well as for regular user assets.
I hope I am not mixing something up. I tested it locally and in serverless deployment, and this looks pretty consistent.
This link ref is no more necessary to include in the Head Section. It cause error 404 in the console: http://localhost:3000/_next/static/style.css net::ERR_ABORTED 404 (Not Found)
The existing example currently does not work because of outdated usage patterns. This PR seeks to update these patterns to the latest recommended best practice while bumping versions.
# Summary
- Bumped version numbers in `package.json`;
- Moved `<link />` tag from `pages/index.js` to `pages/_document.js` as is [recommended](https://github.com/zeit/next-plugins/tree/master/packages/next-css#usage);
- Replace individual css/font imports with import of minified CSS as is [recommended](https://react.semantic-ui.com/usage#semantic-ui-css-package);
- Removed prop (no longer used) from `<List />` element.
