1.

import Layout from '@/views/layout/Layout';export default [    {        // 配置路由，当路径为'/activePublic',使用组件activePublic        path: '/activeManage', component: resolve => require(['@/views/activeManage/index.vue'], resolve),    },    {        // 配置路由，当路径为'/activePublic',使用组件activePublic        path: '/activePublic', component: resolve => require(['@/views/activePublic/index.vue'], resolve),//路由懒加载写法        children : [            { path: '', component: resolve => require(['@/views/activePublic/step1.vue'], resolve)  },            { path: 'step1', component: resolve => require(['@/views/activePublic/step1.vue'], resolve)},            { path: 'step2', component: resolve => require(['@/views/activePublic/step2.vue'], resolve)},            { path: 'step3', component: resolve => require(['@/views/activePublic/step3.vue'], resolve)},            { path: 'step4', component: resolve => require(['@/views/activePublic/step4.vue'], resolve)},        ]    },    {        path: '/', component: resolve => require(['@/views/activePublic/index.vue'], resolve),    },//设置默认路径]

 

错误：Module not found: Error: Can't resolve 'sass-loader' in 'D:\vue_test_project\vuedemo\src'

解决方案：需要安装安装sass-loader以及node-sass插件才能正常运行

cnpm install sass-loader -Dcnpm install node-sass -D

 2.

操作：

import { Siderbar , AppMain } from "@/views/layout";

错误：

 

解决方案：

import Siderbar from "@/views/layout/Siderbar";import AppMain from "@/views/layout/AppMain";

 3.操作：

 

import Siderbar from "@/views/layout/components";import AppMain from "@/views/layout/components";

 

错误：

解决方案：

cnpm install --save babel-runtime。

  import { Siderbar, AppMain } from '@/views/layout/components'

 

 4.操作

App.vuecreated(){    require('./styles/common.scss');}

 

错误：

Module build failed: Error: `sass-loader` requires `node-sass` >=4. Please install a compatible version.

解决方案：

cnpm install node-sass

 

 5.使用Vue.js加sass时遇到 Invalid CSS after ".xxx{": expected "}", was "{" 错误的解决方法

解决方案：

这个问题涉及到 sass 和 scss 的区别。sass 的语法规则是一种缩进语法。而 scss 语法与 css 语法相近，使用大括号。上面那个例子中，home.vue 文件中的 style 标签，lang 属性设置成了 sass，代码如下：

相关链接：https://blog.csdn.net/zhangchao19890805/article/details/64122182

 6.es6模式匹配

 

 

 原因：let不允许在相同作用域内，重复声明同一个变量。set那一行的x y z被重复定义

7.表单验证提示语为英文提示语

 必填字段required写在哪儿的问题，要写在js中，否则在测试环境中会出现验证提示语为英文的问题

错误写法：

 

正确写法：

 

 参考链接：http://baijiahao.baidu.com/s?id=1595080332876070893&wfr=spider&for=pc

　　　　     

 

 8.在同一个页面使用多个ElementUI中 Popover 弹出框(el-popover)，需要指定不同的ref值，否则显示异常

错误写法：

      
                   qq:11            
                   
                   
               
      
        
      
                   wx：222            
                   
                   
               
      

 效果：

 9.{

{form.lang.name}} 造成的

Vue.js报错—TypeError: Cannot read property 'Name' of undefined

解决方案：

form:{    lang：{}}

10.form表单验证提示语问题

不显示提示语问题

解决方案：

 

 

 相关链接：https://blog.csdn.net/u010865136/article/details/79374789

11.npm install 安装依赖一直失败

 错误截图：

解决方案：

安装淘宝镜像，使用cnpm install

相关链接：https://blog.csdn.net/qq_38225558/article/details/86485843

 12.报错比如，[Vue warn]: Do not use built-in or reserved HTML elements as component id: table

解决方案：给组件命名"table"造成的，不能使用html元素命名，改个名字就好了

 13.报错[Vue warn]: Error in v-on handler: "TypeError: record is undefined"，是因为路由跳转时写的不对

 

14.在使用Element中的Dialog弹框时，弹出框被遮盖层遮盖的问题

错误效果图：

 

原因：父级元素加了层级

解决方案：给dialog加一个 append-to-body 属性

 15.在引入组件时，组件名在服务器端比较严格，有大小写问题

 

 

 

 

 

 

 

 

 

 

 

作者：smile.轉角

QQ：493177502