2020/01/04

HTMLを vim で修正していると、閉じタグまで同時に編集されたり、ヤンクで思わぬ挙動をしてしまう。

これは、HTMLタグのカーソルがミラーリングしている場合に発生する。 「設定 > Mirror Cursor On Matching Tag」を無効にする。

VSCode ミラーリング

  2019/03/14

入れる機能拡張や設定によるが、テーブルの「td」「th」はデフォルトで自動整形は改行されてしまう。 (div とかは改行されない・・・)



  都市


  東京

個人的に好きではないので、「td」「th」は改行しないように変更

VSCode「html.format」設定

「html.format.contentUnformatted」にタグをカンマ区切りで記述

"html.format.contentUnformatted": "th,td,pre,code,textarea",

都市
東京

ただし、予め改行されているものはこの設定だけでは1行にできない模様

  2018/09/21

エクスプローラ移動 ⌘ + 0

ディレクトリ切替 Ctrl + R

  • 新規ウィンドウ ⌘ + Enter

新規ウィンドウ Shift + ⌘ + N

  2018/07/08

VSCode で pylint を利用すると from import などで警告がでる場合がある。 警告を非表示にしたい場合、.pylintrc の [MESSAGES CONTROL] disable を設定して表示をカスタマイズできる。

$ pylint --generate-rcfile > ~/.pylintrc

文字列やエラーコードで設定する

設定例

const-rgx=[a-z_][a-z0-9_]{2,30}$ const-name-hint=[a-z_][a-z0-9_]{2,30}$ include-ids=yes symbols=yes disable=print-statement,parameter-unpacking,unpacking-in-except,old-raise-syntax,backtick,import-star-module-level,apply-builtin,basestring-builtin,buffer-builtin,cmp-builtin,coerce-builtin,execfile-builtin,file-builtin,long-builtin,raw_input-builtin,reduce-builtin,standarderror-builtin,unicode-builtin,xrange-builtin,coerce-method,delslice-method,getslice-method,setslice-method,no-absolute-import,old-division,dict-iter-method,dict-view-method,next-method-called,metaclass-assignment,indexing-exception,raising-string,reload-builtin,oct-method,hex-method,nonzero-method,cmp-method,input-builtin,round-builtin,intern-builtin,unichr-builtin,map-builtin-not-iterating,zip-builtin-not-iterating,range-builtin-not-iterating,filter-builtin-not-iterating,using-cmp-argument,long-suffix,old-ne-operator,old-octal-literal,suppressed-message,useless-suppression,import-error,missing-docstring,invalid-name,C0111,W0611

エラーコード一覧

http://pylint-messages.wikidot.com/all-codes

  2018/06/07

Yeoman を利用して VSCode の機能拡張を作成する。

nodebrew で node をインストール

$ nodebrew install v8.11.2

node のバージョンを指定

$ nodebrew list v5.6.0 v5.7.0 v8.11.2 v10.4.0 $ nodebrew use v8.11.2

npm のアップデート

$ npm update -g npm

Yeoman インストール

$ npm install -g yo generator-code

Yeoman でプロジェクト作成(scaffold)

$ yo code ========================================================================== We're constantly looking for ways to make yo better! May we anonymously report usage statistics to improve the tool over time? More info: https://github.com/yeoman/insight & http://yeoman.io ... What type of extension do you want to create? (Use arrow keys) ❯ New Extension (TypeScript) New Extension (JavaScript) New Color Theme New Language Support New Code Snippets New Keymap New Extension Pack

機能拡張は「New Extension」を選択(JavaScript か TypeScript) 名称や作者など各設問に答えていくと、自動作成される。

主要ファイル構成

  • メインプログラム extension.ts
  • 機能拡張の情報 package.json

パブリッシュ

実際に機能拡張をパブリッシュする場合は、vsce をインストールしておく。

npm install -g vsce

  2018/06/05

「Live Sass Compiler」で Sass を watch できるが、ディレクトリ指定する場合、ユーザ設定に記述すると便利


{
    "liveSassCompile.settings.formats":[
        {
            "format": "expanded",
            "extensionName": ".css",
            "savePath": "/public/stylesheets/"
        },
       {
            "format": "compressed",
            "extensionName": ".min.css",
            "savePath": "/public/stylesheets/"
        },
    ]
}

format: CSSスタイル = expanded, compact, compressed, nested extensionName: 拡張子 savePath: 出力先(プロジェクトフォルダをルートとする)

  2018/06/05

    "vim.useSystemClipboard": false,
    "vim.easymotion": true,
    "files.associations": {
        "*.phtml": "html"
    },
    "vim.searchHighlightColor": "rgba(250, 0, 0, 0.3)",
    "vim.startInInsertMode": false,
    "vim.statusBarColorControl": true,

useSystemClipboard: システムのクリップボードを利用すると相互に引き継がれるのでオフ easymotion: カーソル移動の拡張版 searchHighlightColor: ハイライト色設定 startInInsertMode: 選択時のインサートモードはオフにする

  2018/06/04

単語一括選択

VSCodeの単語一括選択は、vim の Normalモードを維持してくれるので、そのままインサートできる。

1) 単語選択(VSCode) shift + cmd + L

2) インサート(vim) i

単語随時選択

単語選択「cmd + D」で選択した場合、Multi Cursorモードになる為、Normalモードに戻す必要がある。

1) 単語選択(VSCode) cmd + D

2) Normalモード v

3) インサート(vim) i

  2018/05/14

フレームワークや独自のライブラリの利用で、VSCode標準でない拡張子を利用することがある。 デフォルトでは任意のフォーマットできないため、ユーザ設定に「拡張子」「フォーマッタ」を記述する。


{
    "files.associations": {
        "*.phtml":"html"
    }
}

  2018/05/08

VScode(Mac High Sierra)で PHP7 に対応(コード補完など)させるためには、PHP7をインストールして設定する。 brew か phpenv か迷うが自分は MacでWebサーバを利用せず bin だけ利用できればよいので brew にした。 XAMPPは起動とか面倒そうなのでやめた。

php7インストール(brew版)

phpenvは Warning がでていたので、とりあえず brew でインストール

$ brew update $ brew upgrade $ brew install gcc re2c mcrypt libmcrypt autoconf automake libiconv $ brew install php@7.2

.bash_profile にパスを記述

$ vi ~/.bash_profile
export PATH="/usr/local/opt/php@7.2/bin:$PATH"
export PATH="/usr/local/opt/php@7.2/sbin:$PATH"

php7インストール(phpenv版)

git clone https://github.com/CHH/phpenv.git sh ./phpenv/bin/phpenv-install.sh

bash_profile にパスを記述 $ vi ~/.bash_profile

export PATH="$HOME/.phpenv/bin:$PATH"
eval "$(phpenv init -)"

ターミナル再起動後、php-buildインストール

$ git clone https://github.com/CHH/php-build.git ~/.phpenv/plugins/php-build

PHP7と関係パッケージインストール

$ brew install libevent libjpeg libpng mcrypt libtool openssl autoconf libxml2 lemon re2c $ phpenv install -l $ phpenv install 7.2.5

phpenv で PHPバージョン切替

$ phpenv global 7.2.5 $ phpenv versions

パス設定

.bash_profile にパスを記述

export PATH="/Users/yoo/.phpenv/bin:$PATH"
eval "$(phpenv init -)"

VScodeユーザ設定

php7のパスを設定

$ which php /usr/local/opt/php@7.2/bin/php

    "php.executablePath": "/usr/local/opt/php@7.2/bin/php",
    "php.validate.executablePath": "/usr/local/opt/php@7.2/bin/php",
    "php.validate.enable": true,

VScode拡張プラグイン

差し当たり自分にあったPHPプラグインをインストール - PHP IntelliSense - PHP Intelephense - PHP DocBlocker - PHP Debug *「PHP Intelephense」はコード整形が動作しなかった。 *「 PHP Intellisense - Crane」は定義ジャンプが自分向きでなかった。 *「php cs fixer」はエラーになるので利用しない。

<< Top < Prev Next > Last >>