matthew as a q.

目標10記事quant

Visual Studioで空のプロジェクト実行結果を表示

Visual Studioで空のプロジェクトを作成した場合、そのプロジェクトをアプリケーションとして実行しようとすると、一瞬で実行結果の表示画面が消えてしまいます。
ハロワも一瞬で消えてしまい、正しく表示できているかわからないので、実行後に何かのキーを押さないと実行結果画面が消えないようにします。

  • 実行結果画面が消えないようにする方法 with Visual Studio

1. ソリューションエクスプーラーでスタートアッププロジェクトとして設定しているプロジェクトを右クリックしてプロパティを開く
2. 「構成プロパティ」→「リンカ」→「システム」を選ぶ
3. 「サブシステム」で「コンソール(/SUBSYSTEM:CONSOLE)」を選択

chromeで文字色カラーパレットを使う

# 動機

  • 好みの色から、その色のカラーコードを知りたい

# 手順

  • Chromeで文字色を確認したい文字の上で、右クリック→「検証」を選択
  • Chrome上に「style」タブが表示された状態で、chrome developer consoleが立ち上がる
  • CSSで指定した「color」の項目で、カラーコードの横にカラーパレットを表示するボタンが出てくる

f:id:takeknock:20180228215324p:plain

上記画面の右のほうにカラーパレットが立ち上がっている。

  • 立ち上がったカラーパレット上で好きな色を選択すると、その色に対応したカラーコードが取得できる

Target container is not a DOM element.

# エラーメッセージ
Target container is not a DOM element.


# 解決法
Webpackの出力ファイル(ここではbundle.jsの読み込みをページの最後に行う)

## before(error)

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title></title>
    <link rel="stylesheet" href="bundle.css">
    <script src="bundle.js" charset="utf-8"></script>
  </head>
  <body>
    <div class="container">
    </div>
  </body>
</html>

## after(correct)

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title></title>
    <link rel="stylesheet" href="bundle.css">
  </head>
  <body>
    <div class="container">
    </div>
  </body>
  <script src="bundle.js" charset="utf-8"></script>
</html>

.suoファイルについて

- 各ユーザのファイル配置等の情報が入っている

- ただし、パスは絶対パスで記載されているため、.suoファイルをGit等にアップして、開発者と共有するのはおすすめしない。もちろんCI環境でも、.suoファイルを作った開発者と同じ絶対パスにものを配置する必要があるので、使い勝手よくない。(GithubVisual Studioの.gitignoreでも.suoファイルはignore対象だったはず)

.suoファイルについて

- 各ユーザのファイル配置等の情報が入っている

- ただし、パスは絶対パスで記載されているため、.suoファイルをGit等にアップして、開発者と共有するのはおすすめしない。もちろんCI環境でも、.suoファイルを作った開発者と同じ絶対パスにものを配置する必要があるので、使い勝手よくない。(GithubVisual Studioの.gitignoreでも.suoファイルはignore対象だったはず)

チーム開発におけるGit運用(切り戻し編)

背景

チームでGitを使った開発をしているときに、すでに行ったコミットを取り消したくなったときの対処。

 

基本方針

Gitのコミット履歴は書き換えない!

そのためにgit revertを使う!

 

git rebaseは使わない。git reset --hardも既に他のリモートレポジトリにpushしているコミット履歴がある場合には使わない。

 

Expected linebreaks to be 'LF' but found 'CRLF' linebreak-style

前提

  • 開発端末: Windows 10
  • エディタ: Atom(editorconfig対応エディタ)
  • 静的解析: eslint
    • .eslintrc.jsにて設定を書いている

どんなエラー?

  • eslintの出す警告
  • 期待する改行コードが"LF"にも関わらず、"CRLF"が改行コードとなっている場合に発生。

解決策

大きく2つある。

Editorで使用する改行コードを"LF"に変更する。

「.editorconfig」に以下を追記。

[*]
end_of_line = lf

期待する改行コードを"CRLF"にする

「.eslintrc.js」に以下を追記

module.exports = {
    "extends": "airbnb",
    "rules": {
      ...
      "linebreak-style": ["error", "windows"], //この行を追記
    },
};