인프런 영문 브랜드 로고
인프런 영문 브랜드 로고

인프런 커뮤니티 질문&답변

doyn0822님의 프로필 이미지
doyn0822

작성한 질문수

Vue3 완벽 마스터: 기초부터 실전까지 - "기본편"

프로젝트 구성

eslint, prettierr 충돌

작성

·

634

0

초기 세팅을 하던 중 포매팅을 하게 되면

에러가 발생합니다 스크린샷 2023-09-14 오전 12.24.22.png

  • eslintrc.cjs 파일

    /* eslint-env node */
    require('@rushstack/eslint-patch/modern-module-resolution');
    
    module.exports = {
    	root: true,
    	extends: [
    		'plugin:vue/vue3-essential',
    		'eslint:recommended',
    		'@vue/eslint-config-prettier',
    	],
    	env: {
    		'vue/setup-compiler-macros': true,
    	},
    	rules: {
    		'no-console': process.env.NODE_ENV === 'production' ? 'error' : 'off',
    		'no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'off',
    		'prettier/prettier': [
    			'error',
    			{
    				singleQuote: true,
    				semi: true,
    				useTabs: true,
    				tabWidth: 2,
    				trailingComma: 'all',
    				printWidth: 80,
    				bracketSpacing: true,
    				arrowParens: 'avoid',
    				endOfLine: 'auto',
    			},
    		],
    	},
    };
  • prettierrc.json 파일

{
  "$schema": "https://json.schemastore.org/prettierrc",
  "semi": true,
  "tabWidth": 2,
  "singleQuote": true,
  "printWidth": 80,
  "trailingComma": "none"
}
  • settings.json 파일

{
  "workbench.iconTheme": "material-icon-theme",
  "workbench.startupEditor": "none",
  "files.autoSave": "afterDelay",
  "editor.fontFamily": "MesloLGS NF",
  "terminal.integrated.fontFamily": "monospace",

  // Eslint-settings
  "editor.codeActionsOnSave": {
    "source.fixAll.eslint": true
  },
  "editor.tabSize": 2,
  "[typescript]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
  },
  "[json]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
  },
  "eslint.validate": [
    "javascript",
    "javascriptreact",
    "typescript",
    "typescriptreact",
    // "html",  // 삭제
    "vue",
    "markdown"
  ],

  // Prettier-settings
  "prettier.printWidth": 80,
  "prettier.tabWidth": 2,
  "prettier.trailingComma": "all",
  "prettier.jsxSingleQuote": false,
  "prettier.semi": true,
  "prettier.useTabs": true,
  "prettier.proseWrap": "preserve",
  "prettier.arrowParens": "avoid",
  "prettier.singleQuote": true,
  "prettier.htmlWhitespaceSensitivity": "ignore",
  "prettier.endOfLine": "auto",
  "prettier.quoteProps": "as-needed",
  "prettier.requireConfig": false,
  "prettier.ignorePath": ".prettierignore",
  "prettier.bracketSpacing": true,
  "prettier.requirePragma": false,
  "prettier.insertPragma": false,
  "prettier.vueIndentScriptAndStyle": false,
  "[html]": {
    "editor.defaultFormatter": "vscode.html-language-features"
  },
  "[vue]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
  },
  "explorer.confirmDragAndDrop": false,
  "explorer.confirmDelete": false,
  "workbench.colorTheme": "Tokyo Night",
  "workbench.settings.applyToAllProfiles": [


    
  ],
  "settingsSync.ignoredExtensions": [

  ],
  "window.zoomLevel": -1
}

eslint랑 동일하게 다 설정을 했는데도 오류가 나네요
다시 처음부터 하면서 해도 똑같은 오류가 반복이라 글 남겨 봅니다

답변 1

1

doyn0822님의 프로필 이미지
doyn0822
질문자

useTabs랑 이것저것 하다보니 해결했습니다 감사합니다

짐코딩님의 프로필 이미지
짐코딩
지식공유자

어이쿠! 해결이 되어 다행이에요! 🥲 😀

doyn0822님의 프로필 이미지
doyn0822

작성한 질문수

질문하기