下午满怀信心的把之前创建的Vuetify工程部署到Heroku,外网可以访问了。
所以晚上打算按照官方的文档做个简单的网页,谁知道出现v-parallax不能用的问题,开发者工具中的报错信息是这样的:
[Vue warn]: Unknown custom element: <v-parallax> - did you register the component correctly? For recursive components, make sure to provide the "name" option.
由于本人在前端开发方面是小白,刚上来遇到这种问题真心没啥思路,只能去官网和StackOverflow各种找答案,刚开始怀疑创建工程的时候少加了依赖,结果补装了一波,还是不行,后来怀疑是vuetify版本问题,看到官方demo依赖的是1.1.14,更新完之后仍然不行。
最终看到在工程中的src/plugins/vuetify.js文件中有很多Vuetify自定义组件相关的依赖,比如 VNavigationDrawer, VFooter什么的,于是便尝试着加一行parallax相关的VParallax(在源码中搜出来的),没想到结果就正常了。
当然故事到这里还没有结束,我刚才所说到正常是指v-parallax使用网络图片的时候正常了,但是当我尝试引用本地图片时发现又出问题了,还好这次google一下很快找到答案了,vuetify中的自定义组件需要添加:src="require('@/assets/hero.jpeg')",其中 assets/hero.jpeg 就是存放在本地的图片文件路径了,到这里算是完美解决问题了。
后续:如果你使用的v-img时出现类似上面的信息,那么需要更新依赖的vuetify,我更新到了1.2.0,并且像上文提到的那样添加了导入声明,就可以正常使用了。
希望vuetify的开发者在今后能修复一下这个问题吧,否则对初学者来说真心不是很友好。同时希望这篇填坑记录能对后面的尝试者提供帮助~