失败的“tns 预览”ValidationError：无效的选项对象

Question

当我运行“ng serve”或“npm start”时，这个共享模块 nativescript-angular 的 web 应用程序运行良好。当我使用“tns 预览”并用我的移动应用程序扫描二维码时，一切来自：

# Use NativeScript Playground app and scan the QR code above to preview the application on your device.

To scan the QR code and deploy your app on a device, you need to have the NativeScript Playground app:
    App Store (iOS): https://itunes.apple.com/us/app/nativescript-playground/id1263543946?mt=8&ls=1
    Google Play (Android): https://play.google.com/store/apps/details?id=org.nativescript.play

Preparing project...

收件人：

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)
 - options[1] 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)
 - options[2] 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)
ValidationError: Invalid options object. Copy Plugin has been initialized using an options object that does not match the API schema.
    at validate (C:\Users\Admin\source\Repos\Vacerra\VacerraR-D\V-WebApp\node_modules\schema-utils\dist\validate.js:96:11)
    at new CopyPlugin (C:\Users\Admin\source\Repos\Vacerra\VacerraR-D\V-WebApp\node_modules\copy-webpack-plugin\dist\index.js:24:30)
    at module.exports (C:\Users\Admin\source\Repos\Vacerra\VacerraR-D\V-WebApp\webpack.config.js:304:13)
    at handleFunction (C:\Users\Admin\source\Repos\Vacerra\VacerraR-D\V-WebApp\node_modules\webpack-cli\bin\prepareOptions.js:23:13)
    at prepareOptions (C:\Users\Admin\source\Repos\Vacerra\VacerraR-D\V-WebApp\node_modules\webpack-cli\bin\prepareOptions.js:9:5)
    at requireConfig (C:\Users\Admin\source\Repos\Vacerra\VacerraR-D\V-WebApp\node_modules\webpack-cli\bin\convert-argv.js:136:14)
    at C:\Users\Admin\source\Repos\Vacerra\VacerraR-D\V-WebApp\node_modules\webpack-cli\bin\convert-argv.js:142:17
    at Array.forEach (<anonymous>)
    at module.exports (C:\Users\Admin\source\Repos\Vacerra\VacerraR-D\V-WebApp\node_modules\webpack-cli\bin\convert-argv.js:140:15)
    at C:\Users\Admin\source\Repos\Vacerra\VacerraR-D\V-WebApp\node_modules\webpack-cli\bin\cli.js:241:39
    at Object.parse (C:\Users\Admin\source\Repos\Vacerra\VacerraR-D\V-WebApp\node_modules\webpack-cli\node_modules\yargs\yargs.js:567:18)
    at C:\Users\Admin\source\Repos\Vacerra\VacerraR-D\V-WebApp\node_modules\webpack-cli\bin\cli.js:219:8
    at Object.<anonymous> (C:\Users\Admin\source\Repos\Vacerra\VacerraR-D\V-WebApp\node_modules\webpack-cli\bin\cli.js:538:3)
    at Module._compile (internal/modules/cjs/loader.js:1138:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:1158:10)
    at Module.load (internal/modules/cjs/loader.js:986:32)
    at Function.Module._load (internal/modules/cjs/loader.js:879:14)
    at Module.require (internal/modules/cjs/loader.js:1026:19)
    at require (internal/modules/cjs/helpers.js:72:18)
    at Object.<anonymous> (C:\Users\Admin\source\Repos\Vacerra\VacerraR-D\V-WebApp\node_modules\webpack\bin\webpack.js:156:2)
    at Module._compile (internal/modules/cjs/loader.js:1138:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:1158:10)
    at Module.load (internal/modules/cjs/loader.js:986:32)
    at Function.Module._load (internal/modules/cjs/loader.js:879:14)
    at Function.executeUserEntryPoint [as runMain] (internal/modules/run_main.js:71:12)
    at internal/main/run_main_module.js:17:47

• 我试过“npm installe”、“ng update”和nativescript更新+原理图来获得正确的版本..

• 我已经卸载了 Playground，并重新安装了预览应用程序..

• 我已经尝试了这个问题的答案中的步骤：

Nativescript Angular code sharing project problem with Webpack

• 我搜索过 google 和 stackoverflow

到目前为止完全没有运气。有没有人遇到过这个问题并找到了解决方案

提前感谢您的回答！

亲切的问候，

R

Answer 1

看起来 CopyWebpackPlugin 已更新，但您的 webpack.config.js 仍使用旧的配置语法。

更新后的语法应该类似于

new CopyWebpackPlugin({
  patterns: [
    { from: "fonts/**", globOptions: { ignore: [`${relative(appPath, appResourcesFullPath)}/**`] } },
    { from: "**/*.{jpg,png}", globOptions: { ignore: [`${relative(appPath, appResourcesFullPath)}/**`] } },
  ]
}),

确保您拥有fonts 文件夹（即使带有.gitignore 的空文件夹也是如此），因为新版本的复制插件如果找不到它会抛出错误。

Answer 2

见nativescript-preview。您需要在设备上安装 Nativescript Playground 和 Preview 应用。