ESlint 설정 ( with babel , prettier , gitignore)

 

프로젝트에 앞서 설정 맞추기에 들어갔다.

 

ESlint 는 에어비엔비룰을 사용했고 프리티어로 문법 교정을 통일했다. node modules 같은 파일/폴더는 gitignore 에서 제공하는 양식을
사용했다.

 

1.eslint config airbnb , eslint , plugin-import 설치

$ yarn add eslint-config-airbnb-base eslint eslint-plugin-import

2.프로젝트 폴더 내부에 .eslintrc.js 파일 생성

 

3. 코드작성

module.exports = {
  env: {
    browser: true,
    es6: true,
    node: true
  },
  extends: "airbnb-base",
  globals: {
    Atomics: "readonly",
    SharedArrayBuffer: "readonly"
  },
  parserOptions: {
    ecmaVersion: 2018,
    sourceType: "module"
  },
  rules: {}
};

4.eslint-config-prettier 다운 

$yarn add eslint-config-prettier

5. go to .eslintrc.js file and change "extends" from   "airbnb-base", to ["airbnb-base", "prettier"],

module.exports = {
  env: {
    browser: true,
    es6: true,
    node: true
  },
  extends: "["airbnb-base", "prettier"]",
  globals: {
    Atomics: "readonly",
    SharedArrayBuffer: "readonly"
  },
  parserOptions: {
    ecmaVersion: 2018,
    sourceType: "module"
  },
  rules: {}
};

 

7. .gitignore 파일 생성

 

8.gitignore 는 Nodejs gitignore master 라고 이미 정해진 것이 있는 양식을 사용했다.

# Logs
logs
*.log
npm-debug.log*
yarn-debug.log*
yarn-error.log*
lerna-debug.log*

# Diagnostic reports (https://nodejs.org/api/report.html)
report.[0-9]*.[0-9]*.[0-9]*.[0-9]*.json

# Runtime data
pids
*.pid
*.seed
*.pid.lock

# Directory for instrumented libs generated by jscoverage/JSCover
lib-cov

# Coverage directory used by tools like istanbul
coverage
*.lcov

# nyc test coverage
.nyc_output

# Grunt intermediate storage (https://gruntjs.com/creating-plugins#storing-task-files)
.grunt

# Bower dependency directory (https://bower.io/)
bower_components

# node-waf configuration
.lock-wscript

# Compiled binary addons (https://nodejs.org/api/addons.html)
build/Release

# Dependency directories
node_modules/
jspm_packages/

# TypeScript v1 declaration files
typings/

# TypeScript cache
*.tsbuildinfo

# Optional npm cache directory
.npm

# Optional eslint cache
.eslintcache

# Optional REPL history
.node_repl_history

# Output of 'npm pack'
*.tgz

# Yarn Integrity file
.yarn-integrity

# dotenv environment variables file
.env
.env.test

# parcel-bundler cache (https://parceljs.org/)
.cache

# next.js build output
.next

# nuxt.js build output
.nuxt

# vuepress build output
.vuepress/dist

# Serverless directories
.serverless/

# FuseBox cache
.fusebox/

# DynamoDB Local files
.dynamodb/

 

 

++

 

dotenv 의 접근하려면 process.env 를 사용해서 변수에 값을 줄 수 있다.

 

dotenv 를 실행시키면 파일 안에서 환경변수애 접근을 할 수 있다. 

(git ignore  와 비슷함)