Vue CLI 3에서 ESLint 설정 커스터마이징
Vue CLI 3 프로젝트에서 ESLint를 효과적으로 설정하고 필요에 따라 조정하는 방법을 살펴니다.
기본 설정 구조
프로젝트 생성 시 package.json에 자동으로 추가되는 ESLint 설정은 다음과 같습니다.
"eslintConfig": {
"root": true,
"env": {
"node": true
},
"extends": [
"plugin:vue/essential",
"eslint:recommended"
],
"rules": {},
...
8월 25일 08:54에 게시됨
Vue 프로젝트에서 ESLint 비활성화 및 Prettier 기반 전역 코드 포맷 설정
Vue CLI 기반 프로젝트에서 저장 시 자동으로 실행되는 ESLint 검사를 비활성화하고, 대신 Prettier를 사용해 일관된 코드 스타일을 적용하는 방법을 설명합니다.
1. ESLint 자동 검사 비활성화
vue.config.js 파일에서 lintOnSave 옵션을 false로 설정하여 개발 서버 실행 중 저장 시 자동 린트를 끕니다.
const { defineConfig } = require('@vue/cli-service');
modul ...
8월 6일 08:49에 게시됨
Vue 핵심 개념과 프로젝트 구조 이해하기
Vue는 현재 국내에서 가장 많이 사용되는 프론트엔드 프레임워크 중 하나이다. Angular나 React와 비교했을 때 진입 장벽이 낮고 빠르게 제품을 만들 수 있다는 점이 큰 장점이다.
세 가지 프레임워크 모두 SPA(Single Page Application) 구조를 기반으로 하며, 데이터 바인딩, 이벤트 처리, 라우팅, 컴포넌트 등 유사한 개념을 공유한다.
SPA 동작 방식
단일 페이지 애 ...
7월 23일 19:56에 게시됨
Vue CLI 기반 프로젝트 초기화 및 구조 분석
Vue CLI는 Vue.js 공식 팀에서 제공하는 강력한 프로젝트 스캐폴딩 도구로, 개발자가 빠르게 표준화된 Vue 애플리케이션을 구성할 수 있도록 지원합니다. 이 도구는 반복적인 설정 작업을 자동화하고, 웹팩 기반의 빌드 환경, 코드 검사, 라우팅, 상태 관리 등을 통합하여 개발 생산성을 크게 향상시킵니다.
설치는 npm 또는 yarn을 통해 전역으로 수행할 수 있습니 ...
7월 18일 09:22에 게시됨
Vue 프로젝트 기본 설정 가이드
1. 프로젝트 초기화
Vue.js 기반 프로젝트를 구축하려면 먼저 Node.js를 설치해야 합니다. 설치 후 NPM을 통해 Vue CLI 3.0 이상 버전을 전역으로 설치합니다. CLI는 vue ui 명령어로 그래픽 인터페이스를 제공하거나, vue create <project-name> 명령어로 터미널에서 직접 프로젝트를 생성할 수 있습니다.
프로젝트 생성 시 중요한 점은 설정 파일을 분리하는 것입 ...
7월 5일 20:31에 게시됨
Vue.js 기초: 프로젝트 설정부터 핵심 기능까지
환경 구축
NodeJS와 npm을 설치합니다. NodeJS를 검색하여 다운로드하고 설치하면 npm도 함께 설치됩니다. 설치가 성공적으로 완료되었는지 명령 프롬프트(cmd)에서 확인할 수 있습니다.
NodeJS 설치가 완료되면, Vue 개발 도구를 설치합니다:
npm install 명령을 실행할 때 기본적으로 외국 저장소를 사용합니다. 다음 코드를 사용하여 저장소를 중국의 Taobao 미러로 변 ...
6월 1일 09:57에 게시됨