Skip to content

Latest commit

 

History

History
71 lines (67 loc) · 2.36 KB

0.5.x-to-0.7.x.md

File metadata and controls

71 lines (67 loc) · 2.36 KB
Raw

0.5.x to 0.7.x

  • Upgrade soya-next, soya-next-scripts, and soya-next-server to ^0.7.0 and next to ^7.0.2

    yarn upgrade next --pattern soya-next

  • Add export script to scripts in package.json, you can export your react app as static website now:

    {
  ...
  "scripts": {
    ...
+   "export": "soya-next-scripts export",
    ...
  }
  ...
}

  • Remove eject script from scripts in package.json, you can customize webpack config now using next.config.js:

    {
  ...
  "scripts": {
    ...
-   "eject": "soya-next-scripts eject",
    ...
  }
  ...
}

  • Remove createPage from every pages since it's now rendered by custom app (pages/_app.js). If you need to create custom app (pages/_app.js), i.e. layout, global styles, or anything that's rendered universally (client & server) across your application, please see default app as a reference.

  • In previous version (^0.5.0), you need to include /_next/static/style.css into <head> to load CSS. In this version (^0.7.0), it's automatically added so you can omit it from custom document (pages/_document.js) or just remove the custom document (pages/_document.js) to use the default document:

    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>
    );
  }
}