0.4.x to 0.5.x

Upgrade soya-next to 0.5.x and next to 5.x.x
yarn add soya-next [email protected]
Add soya-next-server to start server in production environment
yarn add soya-next-server
Move soya-next-scripts to devDependencies and upgrade it to 0.5.x
yarn remove soya-next-scripts
yarn add --dev soya-next-scripts
Remove styled-modules dependency from package.json and .babelrc
yarn remove styled-modules
{
  ...
  "plugins": [
    ...
-   "styled-modules/babel"
    ...
  ]
}
Update scripts in package.json:
{
  ...
  "scripts": {
-   "analyze": "ANALYZE=1 soya-next-scripts build",
+   "analyze": "BUNDLE_ANALYZE=both soya-next-scripts build",
+   "analyze:browser": "BUNDLE_ANALYZE=browser soya-next-scripts build",
+   "analyze:server": "BUNDLE_ANALYZE=server soya-next-scripts build",
-   "start": "soya-next-scripts start",
+   "dev": "soya-next-scripts dev",
+   "start": "soya-next-server",
  }
  ...
}
If you have custom document (pages/_document.js), include /_next/static/style.css into <head>:
import Document, { Head, Main, NextScript } from "next/document";
import config from "config";
import htmlescape from "htmlescape";
​
const __NEXT_CONFIG__ = { ...config };
// exclude legacy and server config
delete __NEXT_CONFIG__.legacy;
delete __NEXT_CONFIG__.server;
​
export default class extends Document {
  render() {
    const { __NEXT_DATA__ } = this.props;
    return (
      <html>
        <Head>
          <link
            rel="stylesheet"
            href={`${__NEXT_DATA__.assetPrefix}/_next/static/style.css`}
          />
        </Head>
        <body>
          <Main />
          <script
            // eslint-disable-next-line react/no-danger
            dangerouslySetInnerHTML={{
              __html: `__NEXT_CONFIG__ = ${htmlescape(__NEXT_CONFIG__)}`
            }}
          />
          <NextScript />
        </body>
      </html>
    );
  }
}
Migration Guide
API Reference
Last modified 4yr ago