Webpack2ではextensionsに空文字を指定できない

npm install webpack で Webpack2 がインストールされるようになっていたので、試して見たところエラーが出たのでメモ。

エラー

Invalid configuration object. Webpack has been initialised using a configuration object that does not match the API schema.
 - configuration.resolve.enforceExtension should be a boolean.

解決策

extensions にemptyな '' を指定してはいけない。

ソースコード

エラー時のソースコード(一部抜粋)

var webpack_config = {
  resolve: {
    extensions: ['', '.webpack.js', '.ts', '.tsx', '.js']
  }
}

修正後ソースコード

var webpack_config = {
  resolve: {
    extensions: ['', '.webpack.js', '.ts', '.tsx', '.js']
  }
}

参考URL

okamuuu.hatenablog.com

.NET Core開発で手動でのnuget追加方法

.NET Core を使った開発でVisualStudioを使えない場合Nugetを調べるのが大変だと思います。

MacだとRiderがあるからNugetの参照も上手くいくと思ってたんですが、自分の環境だと、RiderでNugetを検索できるけど参照追加しようとすると失敗してしまうという状態でした。 GUIからできないなら自力で書くしかないということで調べてみると自分が探していた情報が出てきました。

  1. .NET Core で使いたいClassをココで調べる。
    docs.microsoft.com
  2. 1.で調べた Assembly を元にNugetを検索する。
    NuGet Gallery | Home
  3. csproj にパッケージ名とバージョンを追記する

※ 詳細は下記参考ページに載っています。

参考

ryuichi111std.hatenablog.com

VisualStudio2015Enterpriseでパッケージが読み込まれない

Visual Studio 2015 Enterprise をインストールして、プロジェクトを作成した時に下記のエラーが表示されました。

'XamarinShellPackage' パッケージは正しく読み込まれませんでした。

f:id:naught00:20170215200116p:plain

参考のURLを見てみると、 http://xvs.xamarin.com/Xamarin.VisualStudio_3.11.524.msi をインストールすると解決すると書いてあったので試してみたところ無事解決しました。

参考

The 'XamarinShellPackage' did not load correctly.

async function でfetchをラップする関数を作る

javascriptで async function の使い方を勘違いしていたようなのでメモ。

先に正しく動く例

export class ApiWrapper {

  public async getResult = (searchText: string) => {

    let myHeaders = new Headers({
      'Token': ''
    });

    const response = fetch(this.apiUrl + searchText, {
      method: 'GET',
      headers: myHeaders,
      mode: 'cors',
      credentials: 'include'
    });

    if (response.status >= 200 && response.status < 300) {
      let data = await response.json();
      return data;
    } else {
      var error = new Error(response.statusText);
      throw error
    }
  }
}

呼び出し側

let hoge = async () => {
  const apiWrapper = new ApiWrapper();
  const fuga = await apiWrapper.getResult('検索したいワード');
  console.log(fuga);
}

何を勘違いしていたのか

functionの前に async を付けて、戻り値は Promiseにすればいいと思っていた。

export class ApiWrapper {

  // タグ一覧取得
  public async getResult = (searchText: string) => {

    let myHeaders = new Headers({
      'Token': ''
    });

    return fetch(this.apiUrl + searchText, {
      method: 'GET',
      headers: myHeaders,
      mode: 'cors',
      credentials: 'include'
    }).then( (response) => {
      if (response.status >= 200 && response.status < 300) {
        return response.json();
      } else {
        var error = new Error(response.statusText);
        throw error
      }
    }).then( (data: any) => {
      console.log('success');
      return data;
    }).catch( (error) => {
      console.log('request failed', error);
      throw error;
    });
  }
}

と書いて、Promiseを返してあげればいいのではと思ってましたが、この場合、呼び出し側では下の様に書かなければいけなくて冗長だなと思ってました。

let hoge = async () => {
  const apiWrapper = new ApiWrapper();
  apiWrapper.getTagList('tag name')
  .then( (response) => {
    console.log(response);
  })
  .catch( (error) => {
    console.log(error);
  });
}

でもこれは勘違いで、 ApiWrapper は Promise を返す Promise になっていただけでした。

これは、 c# だと Task<Task<T>> になっている、と言われてなるほどと思いました。

IntelliJ IDEA で PHP のソースフォルダが見えなくなったとき

PHPのプロジェクトを開いたらディレクトリが見えなくなってしまっていた。
開いているディレクトリの .gitignore などのファイルだけが見えている状態でした。

参考にさせて頂いた、ページを見ると .idea配下のファイルを修正すれば良いと書いてあったのですが自分の環境(Mac)では同様のファイルが見つからなかったので思い切って .idea ディレクトリを削除して、IntelliJ IDEA を再起動したら治りました。

環境

参考

unok.hatenablog.jp

TypeScriptでasync/awaitを使いes5にコンパイルする方法

TypeScriptではasync/awaitを使いつつも、コンパイルした成果物をes5にするための tsconfig.json

libes2015 を追加する

tsconfig.jsonの例

{
  "compilerOptions": {
    "module": "commonjs",
    "target": "es5",
    "noImplicitAny": false,
    "sourceMap": true,
    "jsx": "react",
    "lib": [ "es2015" ]
  },
  "exclude": [
    "node_modules"
  ]
}