怎么實現(xiàn)prettier自動格式化換行?很多新手對此不是很清楚,為了幫助大家解決這個難題,下面小編將為大家詳細講解,有這方面需求的人可以來學習下,希望你能有所收獲。
創(chuàng)新互聯(lián)專注于中大型企業(yè)的成都網(wǎng)站建設(shè)、網(wǎng)站設(shè)計和網(wǎng)站改版、網(wǎng)站營銷服務(wù),追求商業(yè)策劃與數(shù)據(jù)分析、創(chuàng)意藝術(shù)與技術(shù)開發(fā)的融合,累計客戶1000+,服務(wù)滿意度達97%。幫助廣大客戶順利對接上互聯(lián)網(wǎng)浪潮,準確優(yōu)選出符合自己需要的互聯(lián)網(wǎng)運用,我們將一直專注成都品牌網(wǎng)站建設(shè)和互聯(lián)網(wǎng)程序開發(fā),在前進的路上,與客戶一起成長!插件
新建 .prettierrc 文件在根目錄,里面寫上這個
第一個是超出800字符換行,第二個是單引號,第三個是結(jié)尾不要分號
vscode里面的設(shè)置文件settings。json代碼
{ // vscode默認啟用了根據(jù)文件類型自動設(shè)置tabsize的選項 "editor.detectIndentation": false, // 重新設(shè)定tabsize "editor.tabSize": 2, // #每次保存的時候自動格式化 "editor.formatOnSave": true, // // 添加 vue 支持 "eslint.validate": [ "javascript", "javascriptreact", { "language": "vue", "autoFix": true } ], "eslint.autoFixOnSave": true, "vetur.validation.template": false, // #讓prettier使用eslint的代碼格式進行校驗 "prettier.eslintIntegration": true, // #去掉代碼結(jié)尾的分號 "prettier.semi": false, // #使用帶引號替代雙引號 "prettier.singleQuote": true, // #讓函數(shù)(名)和后面的括號之間加個空格 "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": [ "*" ], "window.zoomLevel": 0, // esli彈框報錯 "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": {}, "editor.suggest.snippetsPreventQuickSuggestions": false, "files.associations": { "*.cjson": "jsonc", "*.wxss": "css", "*.wxs": "javascript" }, "emmet.includeLanguages": { "wxml": "html" }, "minapp-vscode.disableAutoConfig": true, "editor.codeActionsOnSave": null, "[vue]": { "editor.defaultFormatter": "esbenp.prettier-vscode" }, "[jsonc]": { "editor.defaultFormatter": "vscode.json-language-features" }, "[javascript]": { "editor.defaultFormatter": "esbenp.prettier-vscode" } }