為什么我在第一次加載時在 nextjs 中沒有得到任何東西（getInitialProps 中的 css 和 params）

Question

伙計們，我是 nextjs 的新手。

當我在頁面文件夾中創建的頁面中使用導入 css 文件時，在第一次加載時沒有加載我必須加載它才能看到它，當我在 getInitialProps 中調用 api 時

下一個.config.js

const withCSS = require('@zeit/next-css');
const withSass = require('@zeit/next-sass');
// const withImages = require('next-images');
// module.exports = withImages()
module.exports = withSass({
    ...withCSS({  
        cssModules: false,
        webpack: function (config) {
            config.module.rules.push({
              test: /\.(eot|woff|woff2|ttf|svg|png|jpg|gif)$/,
              use: {
                loader: 'url-loader',
                options: {
                  limit: 100000,
                  name: '[name].[ext]'
                }
              }
            })
            return config
          }    
    }),
    cssModules: true,

})

// _document.js

import Document, { Head, Main, NextScript } from "next/document";

export default class MyDocument extends Document {
  render() {
    return (
      <html>
        <Head>
          <link rel="stylesheet" href="/_next/static/style.css" />

           <link rel="stylesheet" href="/public/css/fontAwsome/all.min.css" /> 
          <link
            rel="stylesheet"
            href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.11.2/css/all.min.css"
            integrity="sha256-+N4/V/SbAFiW1MPBCXnfnP9QSN3+Keu+NlB+0ev/YKQ="
            crossorigin="anonymous"
          />

          <link
            rel="stylesheet"
            href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.1/css/font-awesome.min.css"
          />
        </Head>
        <body dir="rtl" className="text-right">
          <Main />
          <NextScript />
        </body>
      </html>
    );
  }
}

Answer 1

您正在合並對象與函數next.config.js它在回調中解析回調，一個更簡單的例子是

const withSass = require('@zeit/next-sass');
const withCSS = require("@zeit/next-css");
module.exports = withCSS(withSass({
    webpack(config, options) {
        config.module.rules.push({
            test: /\.(png|jpg|gif|svg|eot|ttf|woff|woff2)$/,
            use: {
                loader: 'url-loader',
                options: {
                    limit: 100000
                }
            }
        });

        return config;
    }
}));

您需要將其導出為withCSS(withSass({ // Config }))

快樂編碼！

為什么我在第一次加載時在 nextjs 中沒有得到任何東西（getInitialProps 中的 css 和 params）

問題描述

1 個解決方案

解決方案1
-1 2019-12-02 07:18:31

為什么我在第一次加載時在 nextjs 中沒有得到任何東西（getInitialProps 中的 css 和 params）

問題描述

1 個解決方案

解決方案1 -1 2019-12-02 07:18:31

解決方案1
-1 2019-12-02 07:18:31