{"record":{"id":"97cdd10341ff8dd7","repo":"vuejs/vue-cli","slug":"configuration-error-avoid-modifying-webpack-out","errorCode":null,"errorMessage":"\n\nConfiguration Error: Avoid modifying webpack output.path directly. Use the \"outputDir\" option instead.\n","messagePattern":"\n\nConfiguration Error: Avoid modifying webpack output\\.path directly\\. Use the \"outputDir\" option instead\\.\n","errorType":"validation","errorClass":"Error","httpStatus":null,"severity":"error","filePath":"packages/@vue/cli-service/lib/util/validateWebpackConfig.js","lineNumber":17,"sourceCode":"module.exports = function validateWebpackConfig (\n  webpackConfig,\n  api,\n  options,\n  target = 'app'\n) {\n  const singleConfig = Array.isArray(webpackConfig)\n    ? webpackConfig[0]\n    : webpackConfig\n\n  const actualTargetDir = singleConfig.output.path\n\n  if (actualTargetDir !== api.resolve(options.outputDir)) {\n    // user directly modifies output.path in configureWebpack or chainWebpack.\n    // this is not supported because there's no way for us to give copy\n    // plugin the correct value this way.\n    throw new Error(\n      `\\n\\nConfiguration Error: ` +\n      `Avoid modifying webpack output.path directly. ` +\n      `Use the \"outputDir\" option instead.\\n`\n    )\n  }\n\n  if (actualTargetDir === api.service.context) {\n    throw new Error(\n      `\\n\\nConfiguration Error: ` +\n      `Do not set output directory to project root.\\n`\n    )\n  }\n\n  if (target === 'app' && singleConfig.output.publicPath !== options.publicPath) {\n    throw new Error(\n      `\\n\\nConfiguration Error: ` +\n      `Avoid modifying webpack output.publicPath directly. ` +\n      `Use the \"publicPath\" option instead.\\n`","sourceCodeStart":1,"sourceCodeEnd":35,"githubUrl":"https://github.com/vuejs/vue-cli/blob/7eb93c169c7520935252e2473387f923ef80d856/packages/@vue/cli-service/lib/util/validateWebpackConfig.js#L1-L35","documentation":"validateWebpackConfig compares the resolved `output.path` to `api.resolve(options.outputDir)`. If a user mutated output.path directly in configureWebpack/chainWebpack, the copy plugin (and other dir-aware steps) would target the wrong folder, so the mismatch is rejected.","triggerScenarios":"In a webpack hook setting `config.output.path = path.resolve(__dirname, 'somewhere')` instead of using outputDir.","commonSituations":"Custom output dir via direct webpack mutation; copy-pasted multi-config snippets.","solutions":["Use the `outputDir` option in vue.config.js to change the build output folder.","Remove the `config.output.path = ...` mutation from your hooks."],"exampleFix":"// vue.config.js — before (in chainWebpack)\nconfig.output.path = path.resolve(__dirname, 'dist2')\n// after\nmodule.exports = { outputDir: 'dist2' }","handlingStrategy":"validation","validationCode":"// inside your webpack hook — never set output.path; assert it stays in sync\nconst path = require('path')\nif (config.output.path !== path.resolve(process.cwd(), options.outputDir)) {\n  throw new Error('Refusing to mutate output.path; set outputDir instead')\n}","typeGuard":null,"tryCatchPattern":null,"preventionTips":["Change the build folder via the outputDir option only.","Treat output.path as read-only in webpack hooks."],"tags":["webpack","configuration","output-dir"],"backgroundTag":null,"analyzedSha":"7eb93c169c7520935252e2473387f923ef80d856","analyzedAt":"2026-08-13T10:13:37.803Z","schemaVersion":2},"datasetVersion":"2026-08-13T14:17:21.547Z"}