前言

如果我们初次使用vue-cli来构建单页SPA应用,在撸代码的过程中有可能会遇到这种因为代码缩进导致

页面报错的问题,导致我们烦不胜烦。接下来我们就来看一看如何解决这个小问题。。。

erro
原因分析

通过查看package.json文件我们可以发现,在文件中默认安装了eslint-loader模块,eslint-loader模块是目前相对比较流行的代码检测工具,可以检测书写的代码是否符合统一规范,可以在一些比较大型的项目开发中统一开发人员的代码风格,这也就是为什么代码缩进有可能导致页面报错的原因(代码缩进不符合规范)。
解决办法
方法一:了解eslint-loader规则,严格按照规范书写代码(这是废话)
方法二:关闭eslint

如果实在普通的webpack项目中我们只需要打开webpack.config.js文件,然后去除ESlint在文件中的配置代码就可以了;

如果是在vue项目中,我们需要打开项目根目录下的build文件夹并且打开该文件夹下的webpack.base.conf.js文件,然后去除ESlint在文件中的配置代码就可以了。

解决在Vue项目中时常因为代码缩进导致页面报错的问题的更多相关文章

  1. 解决关于 vue项目中 点击按钮路由多了个问号

    问题描述: 在vue项目开发过程中,点击按钮结果页面刷新了一遍 后来发现路径变成了 localhost:8080/?#/login 原因: 这里是 form 表单,点击了button 按钮,触发了他的 ...

  2. 21、解决关于 vue项目中 点击按钮路由多了个问号

    在vue项目开发过程中,点击按钮结果页面刷新了一遍 后来发现路径变成了 localhost:8080/?#/login 原因: 这里是 form 表单,点击了button 按钮,触发了他的默认事件,就 ...

  3. Vue 项目在其他电脑 npm run dev 运行报错的解决方法

    一个 Vue 项目从一台电脑上传到 github 上之后,再另外一台电脑上 git clone .并使用 npm run dev 或 npm run start 发生以下报错的解决方法.   报错原因 ...

  4. 解决Vue项目打包之后放到nginx下刷新就报错404的问题

    最近跟着某机构的教学视频敲了一遍vue项目,但是在windows环境下部署的时候就懵逼了放到nginx下正常跑没问题,但是刷新之后就报404错误 前端项目构建vue 脚手架版本 是@vue/cli 4 ...

  5. 踩坑,vue项目中,main.js引入scss文件时报错

    当我们在src目录下创建.scss文件,并在main.js中引用,运行时会报: ERROR Failed to compile with 1 errors 5:25:07 PMThis relativ ...

  6. 解决 maven 项目中加入了 lombok 库后依然报错的问题

    平时我们采用 maven 引入第三方库,可以方便的管理第三方 jar 包,然加入 lombok 后启动 eclipse 依然报错,这是由于 lombok 是通过反射在运行时自动生成 getter(). ...

  7. Vue项目用了脚手架vue-cli3.0,会报错You are using the runtime-only build of Vue where the template compiler is not available.....

    摘自: https://blog.csdn.net/wxl1555/article/details/83187647 报错信息如下图: 报错原因是:vue有两种形式的代码:一种是compiler(模版 ...

  8. 【Kotlin】spring boot项目中,在Idea下启动,报错@Configuration class 'BugsnagClient' may not be final.

    报错如下: Exception encountered during context initialization - cancelling refresh attempt: org.springfr ...

  9. jmeter接口测试-GET请求路径中包含特殊字符或中文导致Response400报错

    问题描述:接口测试中异常用例GET请求路径中包含特殊字符或中文,运行jmeter会报错,取样器中只能看到Response400,响应结果为空 解决思路: 对于通过BODY发送的中文内容可以用Jmete ...

随机推荐

  1. div容器中内容垂直居中

    #box{ width:200px; height:200px; line-height: 200px; vertical-align: middle; margin: 5px; background ...

  2. DataSnap下的分包获取

    DataSnap下通过TQuery—TDataSetProvider—TClientDataSet获取数据,如果是主从数据,则每条主表记录都会触发从表数据的获取. 这种获取和组织数据的方式有一个问题: ...

  3. Django框架(六) Django之模板继承

    模版导入和继承 模版导入 一个页面只能继承一个模板,如何解决了?如何使用多个模板,或者引入其他页面 <% include "a.html" %> 可以引用多次 模板,i ...

  4. Linux电源管理(五)thermal【转】

    本文转载自:https://blog.csdn.net/zhouhuacai/article/details/78172267 版权声明:本文为博主原创文章,未经博主允许不得转载.    https: ...

  5. Ubuntu 18.04 休眠后无法唤醒的解决办法

    解决办法:安装laptop-mode-tools工具包. 1.检查是否安装了grep laptop-mode-tools 工具包 $ dpkg -l | grep laptop-mode-tools ...

  6. Docker 安装Hadoop HDFS命令行操作

    网上拉取Docker模板,使用singlarities/hadoop镜像 [root@localhost /]# docker pull singularities/hadoop 查看: [root@ ...

  7. 安装ubuntu的坑&RHEL7配置

    1.需要其他设置->分区,分区需要有/根目录分区和swap空间,后者文件系统类型选择swap,其他都是ext4 2.普通配置电脑,安装16.04.5 LTS,不要安装最新的,安装重启后卡在那里, ...

  8. Calculate difference between consecutive data points in a column from a file

    cat > temp0015101269125  awk 'p{print $0-p}{p=$0}' temp00152-633-7 REF: https://www.unix.com/shel ...

  9. TIM定时器的应用

    TIM定时器的应用   ①输入捕获的应用: 上一节,我已阐述TIM的输入捕获具体作用有两个(如下图):     对输入信号的测量:                                    ...

  10. Eclipse卸载插件SpringSoource-tool-suite

    Eclipse卸载插件SpringSoource-tool-suite **系统环境:**Mac OS X 引子: 一直在纠结的一个问题,就是Eclipse开发java 项目在配置了InternalR ...