Vue项目启动报错整理4

1、Error:Cannot find module 'xxx'

出现这种报错的时候，说明安装包安装的不全

解决办法：

npm install xxx --save

注意：若是报错时单独安装相应的插件后还会连续出现别的安装不完善，建议直接删除文件夹node_modules

           ，而后再次执行npm install

2、vue.esm.js?3153:591 [Vue warn]: The computed property "errors" is already defined in data. found in ---> <CouponExample> at src\pages\websiteInner\forgetPassword.vue <Website> at src\pages\website.vue <App> at src\App.vue <Root>

解决办法：

// 使用vee-validate（会报冲突， 因为elmentui中fields属性已使用）

import VeeValidate from 'vee-validate';

const config = {

     errorBagName: 'errorBags', // change if property conflicts.

     fieldsBagName: 'fieldBags',

};

Vue.use(VeeValidate, config);

3、子组件使用echats图表，父组件在传递给子组件数据后，刷新页面，图表数据消失

解决办法：

不从父组件传递数据，在子组件的mounted中从后台获取数据，并在axios.get成功获取数据后直接调用图表方法即可

4、

Elements in iteration expect to have 'v-bind:key' directives.' 提示错误如何解决？

在学习vue过程中遇到Elements in iteration expect to have 'v-bind:key' directives.' 这个错误，查阅资料得知Vue 2.2.0+的版本里，当在组件中使用v-for时，key是必须设置的。

解决方式一：设置对应的key

注意上面key值不要用对象或是数组作为key，用string或number作为key，否则报错：[Vue warn] Avoid using non-primitive value as key, use string/number value instead.

解决方式二：更改VS Code编辑器的vetur配置（vscode->文件->首选项->设置->搜索（vetur））

　　　将"vetur.validation.template": true, 改成"vetur.validation.template": false, 即可

两种方式对比，建议还是用第一种方式，:key相当于是索引的作用，提高循环性能