What causes "Invalid package name ${packageName}" in vuejs/vue-cli?

Ensure the package specifier is a valid npm package name optionally followed by @version (e.g., 'lodash', '@vue/cli-service@4.5.0').

vuejs/vue-cli · error · Error

Invalid package name ${packageName}

Error message

Invalid package name ${packageName}

What it means

Thrown by stripVersion in ProjectPackageManager when a package name string does not match the expected pattern /^(@?[^@]+)(@.*)?$/. This pattern requires at least one non-@ character before any optional @version suffix. The function extracts the bare package name from formats like 'pkg@1.0.0' or '@scope/pkg@2.0'.

Source

Thrown at packages/@vue/cli/lib/util/ProjectPackageManager.js:82

    upgrade: ['update', '--loglevel', 'error'],
    remove: ['uninstall', '--loglevel', 'error']
  },
  pnpm: hasPnpmVersionOrLater('4.0.0') ? PACKAGE_MANAGER_PNPM4_CONFIG : PACKAGE_MANAGER_PNPM3_CONFIG,
  yarn: {
    install: [],
    add: ['add'],
    upgrade: ['upgrade'],
    remove: ['remove']
  }
}

// extract the package name 'xx' from the format 'xx@1.1'
function stripVersion (packageName) {
  const nameRegExp = /^(@?[^@]+)(@.*)?$/
  const result = packageName.match(nameRegExp)

  if (!result) {
    throw new Error(`Invalid package name ${packageName}`)
  }

  return result[1]
}

// extract the package scope from the full package name
// the result includes the initial @ character
function extractPackageScope (packageName) {
  const scopedNameRegExp = /^(@[^/]+)\/.*$/
  const result = packageName.match(scopedNameRegExp)

  if (!result) {
    return undefined
  }

  return result[1]
}

View on GitHub (pinned to 7eb93c169c)

Solutions

Ensure the package specifier is a valid npm package name optionally followed by @version (e.g., 'lodash', '@vue/cli-service@4.5.0').
If building the string dynamically, validate it against the regex /^(@?[^@]+)(@.*)?$/ before use.
Separate the package name and version into distinct arguments rather than concatenating if the API supports it.

Example fix

// before
const spec = '@' + version  // e.g. '@1.0.0'
pm.add(spec)
// after
const spec = `vue-cli-plugin-${name}@${version}`
pm.add(spec)

Defensive patterns

Strategy: validation

Validate before calling

function isValidPackageName(spec) {
  return /^(@?[^@]+)(@.*)?$/.test(spec);
}
if (!isValidPackageName(packageSpec)) {
  throw new Error(`Invalid package name: ${packageSpec}`);
}

Type guard

function isPackageName(spec) {
  return typeof spec === 'string' && /^(@?[^@]+)(@.*)?$/.test(spec);
}

Try / catch

try {
  const name = stripVersion(spec);
} catch (e) {
  if (e.message.startsWith('Invalid package name')) {
    console.error(`Package spec '${spec}' is malformed. Expected format: name or @scope/name or name@version.`);
  }
  throw e;
}

Prevention

Validate package name specs against the npm naming rules before passing to package manager APIs.
Avoid constructing package strings by string concatenation of potentially-empty parts.
Separate name and version into distinct parameters when the API allows it.

When it happens

Trigger: Calling an internal package manager method (add, upgrade, remove) with a malformed package string — e.g., '@@1.0', an empty string, a string starting with '@' followed immediately by '@version', or a string that is only a version like '@1.0.0'.

Common situations: A plugin or script programmatically constructs a package specifier incorrectly. User passes a bare version string or double-scoped name to a package manager command. Usually an internal/programmatic error rather than a direct user typo.

Related errors

AI-assisted analysis of vuejs/vue-cli@7eb93c169c (2026-08-13). Data as JSON: /api/errors/46cbf1282c6cbda4. Report an issue: GitHub.