Sapphire611

VSCode & 资源文件相关

12/27/2021 vscode

# 必装插件

  • One Dark Pro++ (TPack)
    • Theme Essentials Extension Pack(One Dark Pro, Material Icon, FiraCode font) for Visual Studio Code
    • 图标、主题、字体美化，记得自己安装一下FiraCode 字体文件，在扩展首页有的
  • GitLen
    • Supercharge the Git capabilities built into Visual Studio Code
    • Git 超级强化套件
  • ESLint
    • Integrates ESLint JavaScript into VS Code.
    • Javascript 地表最强编辑校验，需要一个.eslintrc
  • Prettier
    • Code formatter using prettier ，排版用

# 资源文件 demo

# .eslintrc

{
  "extends": ["eslint:recommended", "plugin:prettier/recommended"],
  "plugins": ["prettier"],
  "env": {
    "browser": true,
    "node": true,
    "es2021": true
  },
  "parserOptions": {
    "ecmaVersion": 12,
    "sourceType": "script"
  },
  "rules": {
    "prettier/prettier": "error",
    "strict": ["error", "global"],
    "no-undef": ["error"],
    "no-constant-condition": ["error", { "checkLoops": false }],
    "no-unused-vars": "off",
    "require-atomic-updates": "off",
    "linebreak-style": ["error", "unix"]
  }
}

# .gitignore

.DS_Store
node_modules
/dist


# local env files
.env.local
.env.*.local

# Log files
npm-debug.log*
yarn-debug.log*
yarn-error.log*
pnpm-debug.log*

# Editor directories and files
.idea
.vscode
*.suo
*.ntvs*
*.njsproj
*.sln
*.sw?
yarn.lock

/.temp
/docs/.vuepress/dist
/test

# .dockerignore

# Logs
logs
*.log
npm-debug.log*
yarn-debug.log*
yarn-error.log*
 
# 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
 
# nyc test coverage
.nyc_output
 
# Grunt intermediate storage (http://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/

# Optional npm cache directory
.npm
 
# Optional eslint cache
.eslintcache
 
# Optional REPL history
.node_repl_history
 
# Yarn Integrity file
.yarn-integrity
 
# dotenv environment variables file
.env

# temp
.tmp/

# vscode
.vscode/

# dist
dist/

# install packages
build/
target/

# intellj
.idea/
.classpath
.project

# Created by https://www.gitignore.io/api/macos
# Edit at https://www.gitignore.io/?templates=macos

### macOS ###
# General
.DS_Store
.AppleDouble
.LSOverride

# Icon must end with two \r
Icon

# Thumbnails
._*

# Files that might appear in the root of a volume
.DocumentRevisions-V100
.fseventsd
.Spotlight-V100
.TemporaryItems
.Trashes
.VolumeIcon.icns
.com.apple.timemachine.donotpresent

# Directories potentially created on remote AFP share
.AppleDB
.AppleDesktop
Network Trash Folder
Temporary Items
.apdisk

# End of https://www.gitignore.io/api/macos


# Created by https://www.gitignore.io/api/linux
# Edit at https://www.gitignore.io/?templates=linux

### Linux ###
*~

# temporary files which can be created if a process still has a handle open of a deleted file
.fuse_hidden*

# KDE directory preferences
.directory

# Linux trash folder which might appear on any partition or disk
.Trash-*

# .nfs files are created when an open file is removed but is still being accessed
.nfs*

# End of https://www.gitignore.io/api/linux



# Created by https://www.gitignore.io/api/windows
# Edit at https://www.gitignore.io/?templates=windows

### Windows ###
# Windows thumbnail cache files
Thumbs.db
Thumbs.db:encryptable
ehthumbs.db
ehthumbs_vista.db

# Dump file
*.stackdump

# Folder config file
[Dd]esktop.ini

# Recycle Bin used on file shares
$RECYCLE.BIN/

# Windows Installer files
*.cab
*.msi
*.msix
*.msm
*.msp

# Windows shortcuts
*.lnk

# End of https://www.gitignore.io/api/windows

# install lock
package-lock.json
yarn.lock

# userConfig
config.js
docs/数据字典

# releasePkg
app.tar
app.tar.gz
rscm-*.zip

# file
/data/*
/cache/*


# git registry
.git
.gitignore

# pretty code
.eslintrc
.prettierrc.js

# test
src/test/*
jest.config.js

#java
jre.tar.gz

#build
app.tar
rscm-backend:*.tar
rscm-backend:*.tar.gz

# .prettierrc.js

module.exports = {
  // 字符串使用单引号
  singleQuote: false,
  // 每行末尾自动添加分号
  semi: true,
  // tab缩进大小,默认为2
  tabWidth: 2,
  // 使用tab缩进，默认false
  useTabs: false,
  // 对象中打印空格 默认true
  // true: { foo: bar }
  // false: {foo: bar}
  bracketSpacing: true,
  // 箭头函数参数括号 默认avoid 可选 avoid| always
  // avoid 能省略括号的时候就省略 例如x => x
  // always 总是有括号
  arrowParens: "always",
  // 换行长度，默认80
  printWidth: 80,

  // 设置为true时,将多行JSX元素的 > 放在最后一行的末尾，而不是单独放在下一行
  /* 
    <button
       className="prettier-class"
       id="prettier-id"
       onClick={this.handleClick}>
       Click Here
    </button> 
     */
  // 设置为false时
  /*
    <button
        className="prettier-class"
        id="prettier-id"
        onClick={this.handleClick}
    >
        Click Here
    </button>
     */
  jsxBracketSameLine: true,
  endOfLine: "lf",
};

# DEBUG (.vscode/launch.json + setting.json)

# launch.json

{
  "version": "0.0.1",
  "configurations": [
    {
      "type": "node",
      "request": "launch",
      "name": "debug",
      "skipFiles": ["<node_internals>/**"],
      "program": "${workspaceFolder}/src/app.js",
      "args": [],
      "outputCapture": "std"
    },
    {
      "type": "node",
      "request": "launch",
      "name": "当前脚本",
      "skipFiles": ["<node_internals>/**"],
      "program": "${file}",
      "outputCapture": "std"
    }
  ]
}

# setting.json

{
    "files.eol": "\n",
    "editor.tabSize": 2
}