no-namespace

no-namespace rule

Prevent namespace imports in React applications. This rule is part of eslint-plugin-react-features.

Quick SummaryCopy Anchor Link

Rule DetailsCopy Anchor Link

Namespace imports (import * as X from 'module') prevent effective tree shaking and increase bundle size. Use named imports instead for better optimization.

Why This MattersCopy Anchor Link

ExamplesCopy Anchor Link

❌ IncorrectCopy Anchor Link

// BAD: Namespace import imports everything
import * as React from 'react';
import * as utils from './utils';
import * as lodash from 'lodash';

function MyComponent() {
  const value = lodash.get(data, 'nested.value');
  return <React.Fragment>{value}</React.Fragment>;
}

✅ CorrectCopy Anchor Link

// GOOD: Named imports enable tree shaking
import React, { Fragment, useState, useEffect } from 'react';
import { formatDate, parseQuery } from './utils';
import get from 'lodash/get';

function MyComponent() {
  const value = get(data, 'nested.value');
  return <Fragment>{value}</Fragment>;
}

// Even better: Use JSX shorthand
function MyComponent() {
  const value = get(data, 'nested.value');
  return <>{value}</>;
}

Configuration ExamplesCopy Anchor Link

Basic UsageCopy Anchor Link

{
  rules: {
    'react-features/no-namespace': 'warn'
  }
}

Related RulesCopy Anchor Link

• no-commonjs - Enforce ES modules
• no-extraneous-dependencies - Import validation

Further ReadingCopy Anchor Link

• Tree Shaking - Webpack docs
• ES Modules - React import patterns

Known False NegativesCopy Anchor Link

• Dynamic imports: const utils = await import('./utils') also yields the whole module namespace and is not reported.

Not reported by design: import type * as T from '...' (erased by TypeScript, nothing is bundled) and export * as ns from '...' (a re-export).

Use this rule

npm install -D oxlint-plugin-react-features

{  "jsPlugins": ["oxlint-plugin-react-features"],  "rules": {    "react-features/no-namespace": "error"  }}

import { defineConfig } from 'vite-plus';export default defineConfig({  lint: {    jsPlugins: ['oxlint-plugin-react-features'],    rules: {      'react-features/no-namespace': 'error',    },  },});