npm run dev 失败：ValidationError：无效的选项对象

Question

npm run dev 失败：ValidationError：无效的选项对象

Dho*_*eb 53 node.js npm vue.js webpack-dev-server webpack-cli

目前正在通过一些教程学习 Vue js 和 express js，我对这些技术仍然是新手。

无论如何，按照教程，我正在构建一个小项目，其中我有一个文件夹“Client”，其中包含项目的前端和另一个包含后端的文件夹“Server”。

就在向 Github 推送提交之前，一切都很好，但是一旦我做了 Github 就发出了一些漏洞信号，并且在修复它们之后 npm run dev 不再起作用。

尝试了多种解决方案但没有任何效果，重新安装可疑模块，在运行npm cache clean --force后重新安装节点模块

这是我得到的错误

npm run dev > client@1.0.0 dev D:\projects\Fullstack web apps\VueJs ExpressJs\tab-tracker\Client > webpack-dev-server --inline --progress --config build/webpack.dev.conf.js D:\projects\Fullstack web apps\VueJs ExpressJs\tab-tracker\Client\node_modules\copy-webpack-plugin\node_modules\schema-utils\dist\validate.js:88 throw new _ValidationError.default(errors, schema, configuration); ^ ValidationError: Invalid options object. Copy Plugin has been initialized using an options object that does not match the API schema. - options[0] misses the property 'patterns'. Should be: [non-empty string | object { from, to?, context?, globOptions?, toType?, force?, flatten?, transform?, cacheTransform?, transformPath?, noErrorOnMissing? }, ...] (should not have fewer than 1 item) at validate (D:\projects\Fullstack web apps\VueJs ExpressJs\tab-tracker\Client\node_modules\copy-webpack-plugin\node_modules\schema-utils\dist\validate.js:88:11) at new CopyPlugin (D:\projects\Fullstack web apps\VueJs ExpressJs\tab-tracker\Client\node_modules\copy-webpack-plugin\dist\index.js:24:30) at Object.<anonymous> (D:\projects\Fullstack web apps\VueJs ExpressJs\tab-tracker\Client\build\webpack.dev.conf.js:61:5) at Module._compile (internal/modules/cjs/loader.js:1133:30) at Object.Module._extensions..js (internal/modules/cjs/loader.js:1153:10) at Module.load (internal/modules/cjs/loader.js:977:32) at Function.Module._load (internal/modules/cjs/loader.js:877:14) at Module.require (internal/modules/cjs/loader.js:1019:19) at require (internal/modules/cjs/helpers.js:77:18) at WEBPACK_OPTIONS (D:\projects\Fullstack web apps\VueJs ExpressJs\tab-tracker\Client\node_modules\webpack-cli\bin\utils\convert-argv.js:114:13) at requireConfig (D:\projects\Fullstack web apps\VueJs ExpressJs\tab-tracker\Client\node_modules\webpack-cli\bin\utils\convert-argv.js:116:6) at D:\projects\Fullstack web apps\VueJs ExpressJs\tab-tracker\Client\node_modules\webpack-cli\bin\utils\convert-argv.js:123:17 at Array.forEach (<anonymous>) at module.exports (D:\projects\Fullstack web apps\VueJs ExpressJs\tab-tracker\Client\node_modules\webpack-cli\bin\utils\convert-argv.js:121:15) at Object.<anonymous> (D:\projects\Fullstack web apps\VueJs ExpressJs\tab-tracker\Client\node_modules\webpack-dev-server\bin\webpack-dev-server.js:84:40) at Module._compile (internal/modules/cjs/loader.js:1133:30) { errors: [ { keyword: 'required', dataPath: '[0]', schemaPath: '#/required', params: [Object], message: "should have required property 'patterns'", schema: [Object], parentSchema: [Object], data: [Object], children: [Array] } ], schema: { definitions: { ObjectPattern: [Object], StringPattern: [Object] }, type: 'object', additionalProperties: false, properties: { patterns: [Object], options: [Object] }, required: [ 'patterns' ] }, headerName: 'Copy Plugin', baseDataPath: 'options', postFormatter: null } npm ERR! code ELIFECYCLE npm ERR! errno 1 npm ERR! client@1.0.0 dev: `webpack-dev-server --inline --progress --config build/webpack.dev.conf.js` npm ERR! Exit status 1 npm ERR! npm ERR! Failed at the client@1.0.0 dev script. npm ERR! This is probably not a problem with npm. There is likely additional logging output above. npm ERR! A complete log of this run can be found in: npm ERR! C:\Users\iheb\AppData\Roaming\npm-cache\_logs\2020-05-21T13_56_52_099Z-debug.log npm ERR! code ELIFECYCLE npm ERR! errno 1 npm ERR! client@1.0.0 start: `npm run dev` npm ERR! Exit status 1 npm ERR! npm ERR! Failed at the client@1.0.0 start script. npm ERR! This is probably not a problem with npm. There is likely additional logging output above. npm ERR! A complete log of this run can be found in: npm ERR! C:\Users\iheb\AppData\Roaming\npm-cache\_logs\2020-05-21T13_56_52_148Z-debug.log
Run Code Online (Sandbox Code Playgroud)
这是日志文件：

0 info it worked if it ends with ok 1 verbose cli [ 1 verbose cli 'C:\\Program Files\\nodejs\\node.exe', 1 verbose cli 'C:\\Program Files\\nodejs\\node_modules\\npm\\bin\\npm-cli.js', 1 verbose cli 'run', 1 verbose cli 'build:server' 1 verbose cli ] 2 info using npm@6.14.4 3 info using node@v12.16.3 4 verbose stack Error: missing script: build:server 4 verbose stack at run (C:\Program Files\nodejs\node_modules\npm\lib\run-script.js:155:19) 4 verbose stack at C:\Program Files\nodejs\node_modules\npm\lib\run-script.js:63:5 4 verbose stack at C:\Program Files\nodejs\node_modules\npm\node_modules\read-package-json\read-json.js:116:5 4 verbose stack at C:\Program Files\nodejs\node_modules\npm\node_modules\read-package-json\read-json.js:436:5 4 verbose stack at checkBinReferences_ (C:\Program Files\nodejs\node_modules\npm\node_modules\read-package-json\read-json.js:391:45) 4 verbose stack at final (C:\Program Files\nodejs\node_modules\npm\node_modules\read-package-json\read-json.js:434:3) 4 verbose stack at then (C:\Program Files\nodejs\node_modules\npm\node_modules\read-package-json\read-json.js:161:5) 4 verbose stack at C:\Program Files\nodejs\node_modules\npm\node_modules\read-package-json\read-json.js:281:12 4 verbose stack at C:\Program Files\nodejs\node_modules\npm\node_modules\graceful-fs\graceful-fs.js:115:16 4 verbose stack at FSReqCallback.readFileAfterClose [as oncomplete] (internal/fs/read_file_context.js:63:3) 5 verbose cwd D:\projects\Fullstack web apps\VueJs ExpressJs\tab-tracker\Client 6 verbose Windows_NT 10.0.18362 7 verbose argv "C:\\Program Files\\nodejs\\node.exe" "C:\\Program Files\\nodejs\\node_modules\\npm\\bin\\npm-cli.js" "run" "build:server" 8 verbose node v12.16.3 9 verbose npm v6.14.4 10 error missing script: build:server 11 verbose exit [ 1, true ]
Run Code Online (Sandbox Code Playgroud)
运行npm audit会得到以下结果：

Moderate Cross-Site Scripting Package serialize-javascript Patched in >=2.1.1 Dependency of uglifyjs-webpack-plugin [dev] Path uglifyjs-webpack-plugin > serialize-javascript More info https://npmjs.com/advisories/1426
Run Code Online (Sandbox Code Playgroud)

相关依赖

"webpack": "^4.43.0",

"webpack-bundle-analyzer": "^3.3.2", "webpack-cli": "^3.3.11", "webpack-dev-server": "^3.1.11",
Run Code Online (Sandbox Code Playgroud)

我希望我为你们提供了一切，如果没有，我会立即提供任何东西来帮助澄清我的问题，因为我说过我是网络开发的新手。

更新：我试图找出此类错误背后的原因，在更新有效的webpack-dev-server 版本后出现问题：

"webpack-dev-server": "^2.9.1"

有错误的版本：

"webpack-dev-server": "^3.11.0"

如果我忽略发现的漏洞可以吗？因为尝试修复它们会导致此错误。

谢谢

Answer 1

Mar*_*lug 104

这不是webpack或webpack-dev-server本身的问题，而是 copy-webpack-plugin插件的问题。

随着对 6.x 主要版本的更新，出现了一个重大变化：不是直接将带有配置模式的数组传递给CopyWebpackPlugin构造函数，您现在必须将它包装在patterns一个对象的属性中并传递它。

旧语法：

    new CopyWebpackPlugin(
      [
        { from: 'src/xxx.ext', to: 'dist/xxx.ext' },
        { from: 'src/yyy.ext', to: 'dist/yyy.ext' }
      ]
    )

Run Code Online (Sandbox Code Playgroud)

新语法：

    new CopyWebpackPlugin(
      { 
        patterns: [
          { from: 'src/xxx.ext', to: 'dist/xxx.ext' },
          { from: 'src/yyy.ext', to: 'dist/yyy.ext' }
        ]
      }
    )

Run Code Online (Sandbox Code Playgroud)

他们这样做是因为构造函数现在支持一个额外的options属性：https : //webpack.js.org/plugins/copy-webpack-plugin/#options-1

对于我来说，我的前辈使用了 webpack.mix.js 作为配置文件。复制 Webpack 不是直接引用的，而是通过 mix.imagemin 引用的，我使用了这个： <pre><code> mix.imagemin([{patterns: [{ from: '**/*{.png,.gif,.jpg,. jpeg,.svg}', to: 'images/', context: 'src/images/' }, { from: '**/*{.png,.gif,.jpg,.jpeg,.svg}',到：'images/'，上下文：'src/components/' }] }]); </code></pre> (3认同)

Answer 2

小智 43

更新到 3.11 后出现了一个新模板

  plugins: [
    new CopyPlugin({
      patterns: [
        { from: 'source', to: 'dest' },
        { from: 'other', to: 'public' },
      ],
    }),
  ],

Run Code Online (Sandbox Code Playgroud)

Answer 3

小智 9

我有同样的问题。最后，我能够解决它使用

npm install --save copy-webpack-plugin@5.1.1

Run Code Online (Sandbox Code Playgroud)

Answer 4

小智 6

如果您升级到 package.json 中的 copy-webpack-plugin: ^6.0.3 那么当您之前复制整个目录时，以下应该可以工作：

plugins: [
    new CopyWebpackPlugin({
        patterns: [
            {
                from: "[your-src-dir]/*",
                to: "[your-dst-dir]/*",
            },
        ],
    }),
]

Run Code Online (Sandbox Code Playgroud)

在目录目标和源目录名称之后添加 /* 修复它而不忽略漏洞，你不应该这样做。

查看https://webpack.js.org/plugins/copy-webpack-plugin/了解更多信息。

归档时间：	5 年，3 月前
查看次数：	43173 次
最近记录：	4 年，9 月前