使用Vue组件问题汇总

• vue.runtime.esm.js:588 [Vue warn]: Do not use built-in or reserved HTML elements as component id: button

不要使用内置的或保留的HTML元素作为组件ID。有一种情况是组件的name选项设置为HTML元素button。在使用递归组件时需要设置组件的name选项。

• TypeError: Cannot read property ‘validateSchema’ of undefined

webpack4.x缺少webpack-cli的安装：npm install webpack-cli --save-dev

• 下载iview组件库源码执行npm run dev报错：

ERROR in ./node_modules/_css-loader@0.28.11@css-loader?{“sourceMap”:true}!./node_modules/vue-loader/lib/style-compiler?{“optionsId”:“0”,“vue”:true,“scoped”:false,“sourceMap”:true}!./node_modules/_less-loader@4.1.0@less-loader/dist/cjs.js?{“sourceMap”:true}!./node_modules/vue-loader/lib/selector.js?type=styles&index=0!./examples/app.vue

.bezierEasingMixin();
^
Inline JavaScript is not enabled. Is it set in your options?
in /Users/snow/program files/iview-2.0/src/styles/color/bezierEasing.less (line 110, column 0)
@ ./node_modules/vue-style-loader!./node_modules/_css-loader@0.28.11@css-loader?{“sourceMap”:true}!./node_modules/vue-loader/lib/style-compiler?{“optionsId”:“0”,“vue”:true,“scoped”:false,“sourceMap”:true}!./node_modules/_less-loader@4.1.0@less-loader/dist/cjs.js?{“sourceMap”:true}!./node_modules/vue-loader/lib/selector.js?type=styles&index=0!./examples/app.vue

一种解决方案是将依赖包中的less从3.x版本降级为2.x版本：
npm install less@2.7.3 --save-dev
这种方法能够解决其他类似.bezierEasingMixin();出错的问题。

• npm run dev 启动vue项目，vue-router路由正常，刷新界面后出现Cannot GET /xxx

将路由模式关闭history模式，改为默认的hash模式，该问题解决。且webpack热更新也可以正常生效了。怀疑可能跟history模式需要服务器端进行配置，使所有路由指向同一个html有关。