ITの隊長のブログ

ITの隊長のブログです。Rubyを使って仕事しています。最近も色々やっているお(^ω^ = ^ω^)

TypeScriptの雑なメモ

ふぁ!?????ってなったことが多いのでとりあえず雑なメモを残す

ブルーベリー本から keyof

const mmC = {
    mm: 1,
    m: 1e3,
    km: 1e6
}

// OK
// function c(value: number, unit: keyof typeof mmC) {

// !???
// Element implicitly has an 'any' type because expression of type 'string' can't be used to index type '{ mm: number; m: number; km: number; }'.
//  No index signature with a parameter of type 'string' was found on type '{ mm: number; m: number; km: number; }'.
function c(value: number, unit: string) {    
    const mv = value * mmC[unit]
    return {
        mm: mv,
        m: mv / 1e3,
        km: mv / 1e6
    }
}

console.log(c(5600, 'm'))

Genericsの練習とreact-hook-formの型エラーに苦しめられる殴りがき

import * as React from 'react';
import { useForm, UseFormWatch, WatchObserver, Path } from 'react-hook-form';

type FormData = {
  firstName: string;
  lastName: string;
};

type FormData2 = {
  age: number;
  phoneNumber: number;
}

type AO = {
  watch: UseFormWatch<FormData>
  watchFieldName: string
}

type A<T> = {
  watch: UseFormWatch<T>
  watchFieldName: string
}

export interface B extends A<FormData> {}
export interface C extends A<FormData2> {}

// export const useTestHook = ({
//   T,
//   watch,
//   watchFieldName
// }: A<T>) => {
function useTestHook<T,>({
  watch,
  watchFieldName
// }: A<T>) {
}: AO) {
// const useTestHook = <T,>({
//   watch,
//   watchFieldName
// }: A<T>) => {
// // }: B) => {
// // }: A<FormData>) => {
// // }: AO) => {
//   // OK
//   // const watchFieldName = 'lastName'
//   // console.log(watch(watchFieldName))

  // const watchFieldName: WatchObserver<FormData> = () => {};
  // console.log(watch(watchFieldName))
  console.log(watch(`${watchFieldName}` as const))
  console.log(watch('firstName'))
  return false
};

export default function App() {
  const { register, handleSubmit, watch, errors } = useForm<FormData>();
  useTestHook<FormData>({ watch, watchFieldName: 'lastName' })
  // const { register2, handleSubmit2, watch2, errors2 } = useForm<FormData2>({
  //   defaultValues: {}
  // });

  return (
    <p>テスト</p>
  )
}

変化する型

同じじゃなくていいのか

import { UseFormWatch, FieldPath } from 'react-hook-form'

type AAA = {}
type ABCType = {
  watch: UseFormWatch<AAA>
  fieldName: keyof AAA  // よし!
}

const DatePickerForm = ({
  watch,
  fieldName,
}: ABCType) => {
  const { ... } =
    useA<AAA>({
      watch,
      fieldName,
    })
    // 省略
}


type A<T> = {
  watch: UseFormWatch<T>
  fieldName: FieldPath<T> // ↑←↑←!????
}

export const useA = <T>({
  watch,
  fieldName,
}: A<T>) => {
    // 省略 
}

react-hook-formの型はここだ

github.com

色々参考になった記事

qiita.com

zenn.dev

zenn.dev

Mockeryがわからない

laravel.com

Laravelの中に入っているライブラリらしいが、使い方がいまいちわかっておらぬ。Jestでモックの流れをある程度把握した(つもり)と思っているので、ぱっと見なにをやっているかは読めると思っているが、モックできているのかどうかがわからない。

<?php
// 省略
            $status = Password::broker('user')->sendResetLink([
                'email' => $email
            ]);

こんなコードを書いたとして、モックしたいとする。

<?php
// 省略
        // エラーを発生させる
        Notification::shouldReceive('send')
            ->once()
            ->andThrow(new \Exception());

sendResetLinkの奥深くにあるNotificationをモックする場合はこんな感じ

<?php
// 省略
        Password::shouldReceive('broker')->andReturn($broker = Mockery::mock(PasswordBroker::class));
        /** @var Mockery\mock $broker */
        $broker->shouldReceive('sendResetLink')->andReturn(Password::RESET_THROTTLED);

sendResetLink をモックしたい場合は、 PasswordBroker::sendResetLink をモックするだけじゃなくて、brokerからモックしないといけないことがわかったが、あんまりピンときていないマンです。

一旦メモ。

index.lock: File exists.

$ g add app
fatal: Unable to create '~/project_dir/.git/index.lock': File exists.

Another git process seems to be running in this repository, e.g.
an editor opened by 'git commit'. Please make sure all processes
are terminated then try again. If it still fails, a git process
may have crashed in this repository earlier:
remove the file manually to continue.

なにこれ???

ja.exploratory.io

qiita.com

削除してもだめという説明もあるけど、手元は削除したらうまくいった。

macでXcodeをアンインストールしてしまったのでgitが動かない

容量足りなくなって、使わないし「えい!」って消したらgitが動かなくなった。

$ git status
xcrun: error: invalid active developer path (/Library/Developer/CommandLineTools), missing xcrun at: /Library/Developer/CommandLineTools/usr/bin/xcrun

あ〜〜、そういえばそうだったなって思ったが、Xcodeなくてもいられないかなと色々ググってみた。

$ sw_vers
ProductName:    macOS
ProductVersion: 12.4
BuildVersion:   21F79

そしたら、見つかったのでメモ

$ brew install git

# ...
==> Summary
🍺  /usr/local/Cellar/git/2.37.1: 1,559 files, 44.6MB
==> Running `brew cleanup git`...
Disable this behaviour by setting HOMEBREW_NO_INSTALL_CLEANUP.
Hide these hints with HOMEBREW_NO_ENV_HINTS (see `man brew`).
Removing: /usr/local/Cellar/git/2.37.0... (1,552 files, 44.6MB)
Removing: /Users/kazumatamaki/Library/Caches/Homebrew/git--2.37.0... (16.1MB)
xcrun: error: invalid active developer path (/Library/Developer/CommandLineTools), missing xcrun at: /Library/Developer/CommandLineTools/usr/bin/xcrun


# Pathを通す
$ export PATH="$PATH:/usr/local/Cellar/git/2.37.1/bin"

$ git --version
git version 2.37.1

これでおk

error ${url}: Extracting tar content of undefined failed, the file appears to be corrupt: "ENOENT: no such file or directory, chmod ${directory}

yarnインストールするとエラーがでたのでなにこれ?ってなってた。

$ yarn install

ぐぐると下記で治るよ的な書き込みが多かったので試した。

$ yarn install --network-concurrency 1 

すると治った。。。なぜ??????いまいち腑に落ちないがメモっとく。