首页 > 技术文章 > 单文件组件,eslint

ldywebhome 2021-05-06 14:09 原文

1.Vue的单文件是以.vue为后缀构成的,在vue-cli中 .vue为后缀名的文件称之为单文件组件
单文件组件包含三部分:
1. template 组件的模板,用来写虚拟dom
2. script 用来写组件的业务逻辑
3. style 用来写组件的内部样式
 
 
2.vue-loader这个装载器的作用:
去解析以.vue为后缀名的单文件组件
 
3.eslint 是种代码规范,可以通过配置文件将其关闭。
让浏览器遮罩层关闭写个配置文件用 devSrever:{....}
加上lintOnSave:false 直接关闭eslint检查规则
 
若要对某条规则进行关闭可以在 .eslintrc.js 中的rules:{}中加上服务器报错的那个名字 ’名字‘:‘off’
(改完配置文件记得重新启动服务器)
 
4.终极方法,让它自动改正eslint方法:
  1.保证vscode是最新版本
  2.下载打开ESlint插件
  3.按住ctrl+shift+p 搜索找到settings.json 把下面代码随便找个地方拷贝过去
 
  "editor.codeActionsOnSave": {
  "source.fixAll.eslint":true
  },
  "eslint.workingDirectories": [
  {"mode": "auto"}
  ],
  "vetur.ignoreProjectWarning": true,
  "vetur.validation.template": false,
 
(注意最下面蓝条右边的ESLint要打开)
 
5.路径写@能直接定位到src,不用再../出去了
也可以自己定义配置:
configureWebpack: {
  resolve: {
    alias: {
      'assets': '@/assets',
      'con': '@/components',
      'views': '@/views',
    }
  }
}

推荐阅读