next-remove-imports

This is a plugin for nextjs. The default behavior is to remove all .less/.css/.scss/.sass/.styl imports from all packages in node_modules.

Warning CSS Imported by a Dependency #52

• uiwjs/react-md-editor#52 (comment)
• vercel/next.js#9607
• Example: https://codesandbox.io/s/nextjs-example-react-md-editor-qjhn7?file=/pages/index.js
• Example: @uiwjs/next-remove-imports/example
• Example: https://next-remove-imports-example.vercel.app

Install

npm install next-remove-imports
# or
yarn add next-remove-imports

Usage

// next.config.mjs
import removeImports from 'next-remove-imports'

/** @type {function(import("next").NextConfig): import("next").NextConfig}} */
const removeImportsFun = removeImports({
  // test: /node_modules([\s\S]*?)\.(tsx|ts|js|mjs|jsx)$/,
  // matchImports: "\\.(less|css|scss|sass|styl)$"
});

export default removeImportsFun({
  webpack(config, options) {
    return config
  },
});

// next.config.js
const removeImports = require('next-remove-imports')({
  options: { },
})
module.exports = removeImports()

// next.config.js
const removeImports = require('next-remove-imports')()
module.exports = removeImports({
  webpack(config, options) {
    return config
  },
});

// next.config.js
const removeImports = require('next-remove-imports')({
  test: /node_modules([\s\S]*?)\.(tsx|ts|js|mjs|jsx)$/,
  matchImports: "\\.(less|css|scss|sass|styl)$"
});

module.exports = removeImports({
  webpack(config, options) {
    return config
  },
});

// next.config.js
const removeImports = require('next-remove-imports')();

module.exports = (phase, { defaultConfig }) => {
  return removeImports({
    ...defaultConfig
  });
};

Options

export type PluginOptions = {
  /**
   * @default "/node_modules([\s\S]*?)\.(tsx|ts|js|mjs|jsx)$/"
   */
  test?: RegExp;
  /**
   * @default "\\.(less|css|scss|sass|styl)$"
   */
  matchImports?: string;
}

License

Licensed under the MIT License.