升级到webpack4

config/next.config.js

@@ -11,14 +11,38 @@ const withLess = require('@zeit/next-less')
 const withCss = require('@zeit/next-css')
 const withSourceMaps = require('@zeit/next-source-maps')
 const conf = require('../config/config.global');
-const commonsChunkConfig = require('@zeit/next-css/commons-chunk-config')
+// const commonsChunkConfig = require('@zeit/next-css/commons-chunk-config')
 
 const { ANALYZE } = process.env;
 
 const env = process.env.NODE_ENV ? process.env.NODE_ENV : 'development';
 
 let isDev = true;
 
+const commonsChunkConfig = (config, test = /\.css$/) => {
+  // Extend the default CommonsChunkPlugin config
+  config.plugins = config.plugins.map(plugin => {
+    if (
+      plugin.constructor.name === 'CommonsChunkPlugin' &&
+      typeof plugin.minChunks !== 'undefined'
+    ) {
+      const defaultMinChunks = plugin.minChunks
+      plugin.minChunks = (module, count) => {
+        // Move all styles to commons chunk so they can be extracted to a single file
+        if (module.resource && module.resource.match(test)) {
+          return true
+        }
+        // Use default minChunks for non-style modules
+        return typeof defaultMinChunks === 'function'
+          ? defaultMinChunks(module, count)
+          : count >= defaultMinChunks
+      }
+    }
+    return plugin
+  })
+  return config
+}
+
 const nextConfig = {
   distDir: '../build',
   assetPrefix: conf[env].cdn,

package.json

@@ -22,11 +22,11 @@
   "author": "wiwi",
   "license": "MIT",
   "dependencies": {
-    "@zeit/next-css": "^0.2.0",
-    "@zeit/next-sass": "^0.2.0",
-    "@zeit/next-less": "^0.3.0",
-    "@zeit/next-source-maps": "^0.0.2",
-    "@zeit/next-typescript": "^1.1.0",
+    "@zeit/next-css": "^0.2.1-canary.1",
+    "@zeit/next-less": "^0.3.1-canary.1",
+    "@zeit/next-sass": "^0.2.1-canary.1",
+    "@zeit/next-source-maps": "^0.0.3-canary.1",
+    "@zeit/next-typescript": "^1.1.1-canary.1",
     "antd": "^3.6.5",
     "next": "^7.0.0-canary.0",
     "node-sass": "^4.9.1",
@@ -88,7 +88,7 @@
     "ts-node": "^7.0.0",
     "typescript": "^2.9.2",
     "typescript-babel-jest": "^1.0.5",
-    "url-loader": "^1.0.1",
+    "url-loader": "^1.1.1",
     "webpack-bundle-analyzer": "^2.13.1",
     "webpack-bundle-size-analyzer": "^2.7.0"
   },

src/components/Footer.tsx

@@ -61,7 +61,7 @@ const Footer = () => {
         </div>
       </div>
       <div className="footer-bottom"><div className="container"> 上海睿渠网络技术有限公司   ©兜礼   沪ICP备15021038号</div></div>
-      <style jsx>{`
+      <style>{`
         .g-footer{
           color: #fff;
           font-size: 14px;

src/components/Header.tsx

@@ -26,7 +26,7 @@ const Header = ({ router: { pathname } }) => (
         </div>
       </div>
     </header>
-    <style jsx>{`
+    <style>{`
         .navbar_h{
           min-height:100px;
           background: #fff;

src/index.tsx

@@ -13,12 +13,11 @@ export default ({ children, title = '兜礼' }) => (
       <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1" />
       <meta name="viewport" content="initial-scale=1.0, width=device-width" />
       <link rel="icon" href="/static/favicon.ico" />
-      <link rel="stylesheet" href="/_next/static/style.css" />
     </Head>
     <Header />
     { children }
     <Footer />
-    <style jsx>{`
+    <style>{`
       .App-logo {
         animation: App-logo-spin infinite 20s linear;
         height: 80px;

src/pages/about.tsx

@@ -19,7 +19,7 @@ export default () => (
         </ui>
       </div>
     </div>
-    <style jsx>{`
+    <style>{`
         .tips{
           margin: 78px 0 95px;
           font-size: 18px;

src/pages/index.tsx

@@ -140,7 +140,7 @@ class Index extends Component {
           </div>
         </div>
 
-        <style jsx>{`
+        <style>{`
             .function_div{
               margin-top: 40px;
               text-align: center;