如何實現 Next.js SVG 加載程序

Question

由於 Zeit 有一個新品牌，因此沒有更新：

• @zeit/with-css
• @zeit/with-sass

我的代碼正在運行，現在由於這個問題我什至無法運行我的網站。 如何以不同方式加載 SVG？ 我試過 using.babelrc 但沒有用。

代碼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;
    },
  })
);

Answer 1

從 Next.js 9.3 開始，您可以使用內置的 CSS 和 SASS 支持。

有關詳細信息，請參閱內置 SASS 支持。

至於svg - 你不需要裝載機。

假設您有public/foo.svg圖像，您可以在 CSS 中將其指定為url(/foo.svg) 。