Currently learning Vue js and express js through some tutorials, I am still newbie regarding these technologies.
Anyway following the tutorials I am building a small project in which I have a folder "Client" that contains the frontend side of the project and another folder "Server" that contains the backend.
Just before pushing commits to Github, everything was fine, but once I did Github signals some vulnerabilities and after fixing them npm run dev doesn't work anymore.
tried multiples solutions but nothing worked, reinstalled suspicious modules, reinstalled node modules after running npm cache clean --force
This is the error I got
npm run dev
> [email protected] 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! [email protected] dev: `webpack-dev-server --inline --progress --config build/webpack.dev.conf.js`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the [email protected] 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! [email protected] start: `npm run dev`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the [email protected] 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
This is the log file :
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 [email protected]
3 info using [email protected]
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 ]
Running npm audit gives the following :
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
Related dependencies
"webpack": "^4.43.0",
"webpack-bundle-analyzer": "^3.3.2", "webpack-cli": "^3.3.11", "webpack-dev-server": "^3.1.11",
I hope I provided everything for you guys, if not I will immediately provide anything to help clarify my problem, as I said I'm a newbie to web development.
UPDATE: I've trying to figure out the reason behind such error, the problem occurs after updating webpack-dev-server Version that works :
"webpack-dev-server": "^2.9.1"
Version with errors :
"webpack-dev-server": "^3.11.0"
Is it okay if I ignore vulnerabilities found? Because trying to fix them causes this error.
Thanks
This is not an issue with webpack
or webpack-dev-server
itself, but with the copy-webpack-plugin
plugin.
With the update to the 6.x major version came a breaking change: instead of just passing the array with the config patterns directly to the CopyWebpackPlugin
constructor, your now have to wrap it in the patterns
property of an object and pass that.
Old syntax:
new CopyWebpackPlugin(
[
{ from: 'src/xxx.ext', to: 'dist/xxx.ext' },
{ from: 'src/yyy.ext', to: 'dist/yyy.ext' }
]
)
New syntax:
new CopyWebpackPlugin(
{
patterns: [
{ from: 'src/xxx.ext', to: 'dist/xxx.ext' },
{ from: 'src/yyy.ext', to: 'dist/yyy.ext' }
]
}
)
They did that because the constructor now supports an additional options
property:
https://webpack.js.org/plugins/copy-webpack-plugin/#options-1