下一个JS配置多个插件配置

本文介绍了下一个JS配置多个插件配置的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

const {
  DEVELOPMENT_SERVER,
  PRODUCTION_BUILD
} = require("next/constants");

require('dotenv').config()

const path = require('path')
const Dotenv = require('dotenv-webpack')

const nextConfig = {
  webpack: config => ({ ...config, node: { fs: "empty" } })
};
module.exports = phase => {
  if (phase === DEVELOPMENT_SERVER || phase === PRODUCTION_BUILD) {
    const withCSS = require("@zeit/next-css");
    return withCSS(nextConfig);
  }
  return nextConfig;
};
*module.exports =  {
  webpack: (config) => {
    config.plugins = config.plugins || []
    config.plugins = [
      ...config.plugins,
      // Read the .env file
      new Dotenv({
        path: path.join(__dirname, '.env'),
        systemvars: true
      })
    ]
    return config
  }
}*

let prefix;
switch (process.env.NODE_ENV) {
  case "test":
    prefix = "https://test.domain.com/providers";
    break;
  case "stage":
    prefix = "https://state.domain.com/providers";
    break;
  case "production":
    prefix = "https://production.domain.com/providers";
    break;
  default:
    prefix = "";
    break;
}
module.exports = {
  distDir: "build",
  assetPrefix: prefix
};

这是我的next.config.js配置.但是当我尝试运行时，会收到类似错误！网络错误:JSON在位置0处出现意外的令牌N

Here my next.config.js configuration.But when I am trying to run then getting the message likeError! Network error: Unexpected token N in JSON at position 0

但是，当我尝试将任何内容运行到粗体(*)并将其仅保留到next.config.js中时，则可以正常工作.如何将多个插件配置到module.export

But when I am trying to run whatever into the bold(*) and kept only that thing into the next.config.js then working fine.How to configure multiple plugin into the module.export

推荐答案

next-compose-plugins 插件提供了更简洁的API，用于为next.js启用和配置插件.

next-compose-plugins plugin provides a cleaner API for enabling and configuring plugins for next.js.

安装 npm install-保存next-compose-plugins

在 next.config.js 中使用它:

// next.config.js
const withPlugins = require('next-compose-plugins');
const images = require('next-images');
const sass = require('@zeit/next-sass');
const typescript = require('@zeit/next-typescript');

// optional next.js configuration
const nextConfig = {
  useFileSystemPublicRoutes: false,
  distDir: 'build',
};

module.exports = withPlugins([

  // add a plugin with specific configuration
  [sass, {
    cssModules: true,
    cssLoaderOptions: {
      localIdentName: '[local]___[hash:base64:5]',
    },
  }],

  // add a plugin without a configuration
  images,

  // another plugin with a configuration
  [typescript, {
    typescriptLoaderOptions: {
      transpileOnly: false,
    },
  }],

], nextConfig);

这篇关于下一个JS配置多个插件配置的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！

INTO