• vue格式化自动加;等问题


    (1)安装prettier插件

    npm install --save-dev --save-exact prettier
    

    或者全局安装

    npm install --global prettier
    

    新建.prettierrc.json配置文件放在vue项目的root目录下

    配置.prettierrc.json文件如下

    {
        "singleQuote":true,//使用单引号而不是双引号,true就是对
        "semi":false//在语句结尾处打印分号,false就是不打印
    }
    

    设置界面代码:

    {
      // 重新设定tabsize
      "editor.tabSize": 2,
      "vetur.format.defaultFormatter.css": "prettier",
      "vetur.format.defaultFormatter.postcss": "prettier",
      "vetur.format.defaultFormatter.scss": "prettier",
      "vetur.format.defaultFormatter.less": "prettier",
      "vetur.format.defaultFormatter.stylus": "stylus-supremacy",
      "vetur.format.defaultFormatter.ts": "prettier",
      "vetur.format.defaultFormatter.sass": "sass-formatter",
      "vetur.validation.template": false,
      // #让prettier使用eslint的代码格式进行校验
      "prettier.eslintIntegration": true,
      // #去掉代码结尾的分号
      "prettier.semi": false,
      // #使用带引号替代双引号
      "prettier.singleQuote": true,
      // #让函数(名)和后面的括号之间加个空格
      "javascript.format.insertSpaceBeforeFunctionParenthesis": true,
      // #这个按用户自身习惯选择
      "vetur.format.defaultFormatter.html": "js-beautify-html",
      // #让vue中的js按编辑器自带的ts格式进行格式化
      "vetur.format.defaultFormatter.js": "vscode-typescript",
      "vetur.format.defaultFormatterOptions": {
        "js-beautify-html": {
          // 换行
          "wrap_attributes": "force-aligned"
          // 不换行
          // "wrap_attributes": "aligned-multiple"
        }
      },
      // 格式化stylus, 需安装Manta's Stylus Supremacy插件
      "stylusSupremacy.insertColons": false, // 是否插入冒号
      "stylusSupremacy.insertSemicolons": false, // 是否插入分好
      "stylusSupremacy.insertBraces": false, // 是否插入大括号
      "stylusSupremacy.insertNewLineAroundImports": false, // import之后是否换行
      "stylusSupremacy.insertNewLineAroundBlocks": false, // 两个选择器中是否换行
      "auto-rename-tag.activationOnLanguage": [
        "*"
      ],
      // esli弹框报错
      "terminal.integrated.rendererType": "dom",
     
      "devDependencies": {
        "babel-eslint": "^10.0.3",
        "eslint": "^4.15.0",
        "eslint-config-airbnb": "^16.1.0",
        "eslint-plugin-jsx-a11y": "^6.0.3",
        "eslint-plugin-react": "^7.12.1",
        "eslint-config-google": "^0.9.1",
        "eslint-config-standard": "^10.2.1",
        "eslint-plugin-html": "^4.0.1",
        "eslint-plugin-import": "^2.8.0",
        "eslint-plugin-node": "^5.2.1",
        "eslint-plugin-promise": "^3.6.0",
        "eslint-plugin-standard": "^3.0.1"
      },
      "http.proxyAuthorization": null,
      "eslint.migration.2_x": "off",
      "workbench.editorAssociations": [],
      "eslint.codeAction.disableRuleComment": {},
      "eslint.codeAction.showDocumentation": {},
      "files.associations": {
        "*.cjson": "jsonc",
        "*.wxss": "css",
        "*.wxs": "javascript"
      },
      "emmet.includeLanguages": {
        "wxml": "html"
      },
      "minapp-vscode.disableAutoConfig": true,
      "[vue]": {
        "editor.defaultFormatter": "esbenp.prettier-vscode"
      },
      "[jsonc]": {
        "editor.defaultFormatter": "vscode.json-language-features"
      },
      "[javascript]": {
        "editor.defaultFormatter": "esbenp.prettier-vscode"
      },
      "liveServer.settings.donotShowInfoMsg": true,
      "editor.formatOnType": false, // 在键入一行后是否自动化格式
      "editor.formatOnPaste": true, // 在粘贴时自动格式化
      "editor.wordWrap": "off", // 换行规则,off 永不换行
      "editor.detectIndentation": false, // vscode 默认是启用根据文件类型自动设置 tabSize 的值
      // 保存时按照哪个规则进行格式化
      "editor.formatOnSave": false,
      // 自动修复
      "editor.codeActionsOnSave": {
        "source.fixAll.eslint": true,
      },
      // 配置 ESLint 检查的文件类型
      "eslint.validate": [
        "javascript",
        "vue",
        "html"
      ],
      "editor.suggest.snippetsPreventQuickSuggestions": false,
      "beautify.config": "",
      "terminal.integrated.tabs.enabled": true,
      "diffEditor.ignoreTrimWhitespace": false
    }
    
  • 相关阅读:
    JavaScript 执行机制
    前端问题总结
    【2020 -02- 07】组件与模板
    【2020-02-07】组件与模板
    【2020-01-23】组件与模板 -- 模板语法
    关于java.lang.UnsatisfiedLinkError的处理
    两个Activity传递数据和对象
    Android Activity为什么要细化出onCreate、onStart、onResume、onPause、onStop、onDesdroy这么多方法让应用去重载?(转)
    通过Android Studio 导出Jar包
    关于AccessibilityService的用法(转)
  • 原文地址:https://www.cnblogs.com/yxyc/p/14839643.html
Copyright © 2020-2023  润新知