uniquejava / blog

My notes regarding the vibrating frontend :boom and the plain old java :rofl.
Creative Commons Zero v1.0 Universal
11 stars 5 forks source link

vscode #154

Open uniquejava opened 6 years ago

uniquejava commented 6 years ago

vscode setup

Open the Command Palette (⇧⌘P) and type 'shell command' to find the Shell Command: Install 'code' command in PATH command.

https://hackernoon.com/configure-eslint-prettier-and-flow-in-vs-code-for-react-development-c9d95db07213

debug in vscode

https://github.com/Microsoft/vscode-recipes

vscode plugin

Colonize 2.2.2 ESLint 1.4.3 Intellij IDEA Keybinding React-Native/React/Redux snippets for es6/es7

将自动补全分号设置为⌘+;

pm2 start lib/server.js --watch --interpreter babel-node
nodemon lib/server.js --exec babel-node

更多在node中使用es7的配置说明见: https://github.com/babel/example-node-server

vscode debug

https://github.com/Microsoft/vscode-recipes

配置webpack

yarn add react react-dom webpack 见: https://webpack.js.org/concepts/configuration/ webpack.config.js

var path = require('path');

module.exports = {
  entry: './lib/components/Index.js',
  output: {
    path: path.resolve(__dirname, 'public'),
    filename: 'bundle.js'
  },
  module: {
    rules: [
      {test: /\.js$/, exclude: /node_modules/, use: 'babel-loader'}
    ]
  }
};

Uncaught ReferenceError: regeneratorRuntime is not defined

解决 yarn add babel-polyfill, 然后修改webpack.config.js中的entry: ['babel-polyfill','./lib/components/Index.js'],

debug jest in vscode

https://facebook.github.io/jest/docs/en/troubleshooting.html#content https://medium.com/@mattmazzola/how-to-debug-jest-tests-with-vscode-48f003c7cb41 https://gist.github.com/riddla/8830e0485dd0a48533c8fb05da2df09d http://jonathancreamer.com/debugging-node-and-jest-tests-with-vs-codes-debuggger/

uniquejava commented 6 years ago

vetur

vscode user settings

{
    "editor.tabSize": 2,
    "editor.minimap.enabled": false,
    "window.zoomLevel": 0.5,
    "editor.formatOnSave": true,
    "gitlens.advanced.messages": {
        "suppressShowKeyBindingsNotice": true
    },
    "git.enableSmartCommit": true,
    "javascript.updateImportsOnFileMove.enabled": "always",
    "git.autofetch": true,
    "workbench.colorTheme": "Visual Studio Dark",
    "explorer.confirmDragAndDrop": false,
    "explorer.confirmDelete": false,
    "git.confirmSync": false,
    "workbench.iconTheme": "vscode-great-icons",
    "vetur.format.defaultFormatter.html": "js-beautify-html"
}

这个prettier设置可移至package.json .prettierrc

{
  "singleQuote": true,
  "printWidth": 100
}

变成

  "prettier": {
    "singleQuote": true
  },
  "eslintConfig": {
    "root": true,
    "env": {
      "node": true
    },
    "extends": [
      "plugin:vue/essential",
      "@vue/prettier"
    ],
    "rules": {
      "no-console": "off",
      "no-unused-vars": "warn"
    },
    "parserOptions": {
      "parser": "babel-eslint"
    }
  },
uniquejava commented 5 years ago

vscode user settings

{
    "editor.tabSize": 2,
    "editor.minimap.enabled": false,
    "window.zoomLevel": 0.5,
    "editor.formatOnSave": true,
    "gitlens.advanced.messages": {
        "suppressShowKeyBindingsNotice": true
    },
    "git.enableSmartCommit": true,
    "javascript.updateImportsOnFileMove.enabled": "always",
    "git.autofetch": true,
    "explorer.confirmDragAndDrop": false,
    "explorer.confirmDelete": false,
    "git.confirmSync": false,
    "workbench.iconTheme": "vscode-great-icons",
    "vetur.format.defaultFormatter.html": "js-beautify-html",
    "cSpell.userWords": [
        "Vuejs",
        "backend",
        "ibmcloud",
        "internetofthings",
        "mosquitto",
        "uncheck",
        "vetur",
        "vuex"
    ],
    "cSpell.enabledLanguageIds": [
        "asciidoc",
        "c",
        "cpp",
        "csharp",
        "css",
        "go",
        "handlebars",
        "html",
        "jade",
        "javascript",
        "javascriptreact",
        "json",
        "latex",
        "less",
        "markdown",
        "php",
        "plaintext",
        "pub",
        "python",
        "restructuredtext",
        "rust",
        "scss",
        "text",
        "typescript",
        "typescriptreact",
        "yml"
    ],
    "editor.snippetSuggestions": "top",
    "editor.lineHeight": 16,
    "workbench.colorTheme": "Inspired Github",
    "bracketPairColorizer.consecutivePairColors": [
        "()",
        "[]",
        "{}",
        [],
        "Red"
    ],
    "importCost.bundleSizeDecoration": "minified",
    "importCost.showCalculatingDecoration": false,
    "extensions.ignoreRecommendations": false,
    "vsicons.projectDetection.autoReload": true,
    "python.pythonPath": "python3",
    "code-runner.runInTerminal": true,
    "code-runner.executorMap.python": "python3"
}