[typescript] タグが付いた質問
TypeScriptは、JavaScriptに上位互換性を保ちつつ静的型付けなどを加えた言語です。JavaScriptに変換されます。このタグは、TypeScriptに固有の質問用です。通常のJavaScriptの質問には使用されません。
183
質問
0
票
1
回答
164
閲覧数
React TypeScriptにおいて、複数のコンポーネントをまとめる方法は?
使用する際に、ComponentAll.Component1のように強制するにはどのような宣言方法を行えばよいのでしょうか?
component1.tsx
const Component1 = () => (
<input type="email">
)
export default Component1;
component2.tsx
const ...
1
票
0
回答
122
閲覧数
tscがtsconfig.jsonを使用してくれない。 [重複]
TypeScriptでSymbolを使ったコードを書いたのですがtscがtsconfig.jsonに基づいてコンパイルしてくれないためにエラーが発生してしまいます。
以下がTypeScriptのコードです。
main.ts
let symbol = Symbol();
ここで、tsc main.tsコマンドをコマンドラインに入力すると、
error TS2585: 'Symbol' only ...
0
票
1
回答
94
閲覧数
Angularチュートリアル(tour of heroes)において、クエリ文字列の用途と働きがわからない。
名前検索をするに当たり、このクエリ文字列は、どういう機能が働いているのでしょうか。
this.http.get<Hero[]>(`${this.heroesUrl}/?name=${term}`)
以下の画像中の、ここのクエリ文字列の意味が分からないです。
0
票
1
回答
251
閲覧数
stripe.jsのサンプルコードをTypeScript化したいが、型の当て方が分からない。
react-stripe-js 自体はTypeScriptに対応しているというのをドキュメントで見たのですが、どのようにインストールした型を当てていけば良いか分からないです。 CardElementComponent とimportとして使用するみたいな記事をみて const handleChange = async (event: CardElementComponent) => { ...
1
票
1
回答
203
閲覧数
Angular12でng2-chartsのチャート再更新が行われない
前提・実現したいこと
Angular12を用いたWebアプリケーションを作ろうとしています。
外部APIをたたいて得られたデータをng2-chartsによりチャートにします。
再びAPIをたたたとき、先ほどのチャートを新しく得られたデータによって再描画したいと考えています。
発生している問題
はじめてAPIをたたいた結果によるチャートの描画を行うことはできています。
...
2
票
1
回答
121
閲覧数
aws-sdk-js で定義されている型が正しいか分からない
AWSのS3クライアントモジュールにて、下記関数があるのですが、この書き方だとerrが確実にcallbackに入ってくるので、err?: Errorとなっているべきではないか、
と考えてしまいます。
upload(params: S3.Types.PutObjectRequest,
options?: ManagedUpload.ManagedUploadOptions,
...
1
票
1
回答
1,451
閲覧数
TypeScriptでtsconfigが読み込まれない。
下記の記事を参考に tsconfug.json のコメントアウトを外したのですが、エラーが取れないです。
error TS1192: Module '"fs"' has no default export. エラーを取ろうとしてtsconfig.jsonの設定をしていたのですが、設定してもエラーが取れないので、読み込まれていない事に気付きました。
...
1
票
0
回答
371
閲覧数
javascriptで半角入力を強制したinput要素に全角入力を行った際に入力済みの文字が消える現象
Reactを用いて以下のようなコンポーネントを作成しました。
文字が入力された際、それが数字であるなら半角化して反映します。
全角入力をそのままにしてしまうと不具合が起きる("111あああ222"としたとき222の部分が反映されないなど)ため、入力を検知するたびフォーカスを一瞬外して戻すことで強制的に一文字ずつ確定させています。
const InptArea:FC=()=>...
0
票
1
回答
85
閲覧数
Angular-Scullyのプラグインでコンフィグオブジェクトを反映させる方法について
AngularとScullyモジュールを使って静的サイトとしてブログを立ち上げようとしています。
アーカイブページの自動生成をプラグインとして実装しましたが、setConfig関数の使い方が悪いのか、うまくいきません。
プラグインにプラグイン自体のスクリプト以外からコンフィグを設定する方法について
何か見当違いな部分があるのだと思いますが全く解決に至っていません。
確認すべきこと、...
0
票
0
回答
197
閲覧数
Next.jsに追加したgoogle analyticsの gtag.jsをTypeScriptにして型を導入したい。
下記のブログを参考にNext.jsで作成したブログにgoogle analyticsを導入したのですが、gtag.jsをTypeScriptに変換する所で躓いています。
Next.jsでGoogle Analyticsを使えるようにする
google analyticsの型を @types/google.analytics npm install --save @types/google....
0
票
1
回答
193
閲覧数
Next.jsのブログkatexで書かれた数式を表示したい。
mdファイルを取り扱うのに remark を使用しているので remark-math というものをドキュメントに沿ってインストールしたんですが、今で import でモジュールを取り込んできたのに require で読み込んでいてNext.jsではこのようなモジュールの取り込み方は出来るのでしょうか? 一応ドキュメント通り require で試してみたのですが、エラーが出ます。
...
0
票
0
回答
263
閲覧数
Jestでモジュールの一部をモックする
Jestを使ったテストの実装で困っています。
a.ts
export const f1 = () => 'f1';
export const f2 = () => f1();
a.spec.ts
import * as a from './a'
it('f1をstubしたい', () => {
const f1Spy = jest.spyOn(a, 'f1')....
0
票
1
回答
932
閲覧数
TypeScript components内でmap()を使用するとエラーが出る。
<span>タグに topic を代入して出力するコンポーネントを作成したいのですが、 (property) topicList: string[] ',' expected.ts(1005) と出て .map が使えないみたいな表示がされます。なぜこのようになるのか分からないです。コードを見て頂けないでしょうか?
//topicListには["javascript"...
0
票
2
回答
549
閲覧数
AngularのNgForOfのNgとは何の略でしょうか?
AngularのNgForOfのNgとは何の略でしょうか?
NgForOf
0
票
1
回答
140
閲覧数
TypeScriptでアクセストークンを外部ファイル(token.ts)に記述してimportして読み込めるようにしたい。
Next.jsでブログを作成しているものです。Githubのパーソナルアクセストークンをコードにそのまま記述するとGithubにコードをあげる際に困るので、載せたくないアクセストークンを外部ファイルに記述してそれを .gitignoreで無視しようと思うのですが上手く行きません。
やった事
next.jsのルートフォルダにtoken.tsを作成してconst accessToken = &...
0
票
1
回答
1,392
閲覧数
JavaScript(TypeScript)でPromise.allの戻り値を変数に格納出来ない。
Next.jsでブログを作成しています。下記のコードはGitHubリポジトリの内容を取得して、それを加工して datas に格納したいのですが、上手く行きません。
console.log(datas) しても undefinedと表示されます。詳しい方見ていただけないでしょうか。よろしくお願いします。
const datas = await (async (zennArticles) => {...
1
票
2
回答
169
閲覧数
typescript で、 string を特殊化したい
既存のサードパーティ api に対する型付けを行っていると、例えば特殊な形式の文字列がサーバーから return される場合があります。例えば、json文字列のような。
{"foo":"bar"}
このようなフィールドに対しては、 api の戻り値の型として、単純なstringを定義するのではなく、例えばjson_string のような型を定義して、...
0
票
1
回答
78
閲覧数
TypeError: jquery_1.default(...).bootpag is not a function で落ちてしまいます.
このJQueryは何をやっているんでしょう?? の続きです.
検索を行って結果を表示、検索結果の下にbootpag(https://botmonster.com/jquery-bootpag/)を使用して、検索結果のページナビゲーションを表示しようとしています.
bootpagのインストール
npm install --save bootpag
でプロジェクトにインストールしました.
...
0
票
1
回答
1,243
閲覧数
TypeScriptで定義した型を再利用出来るようにapi.d.tsに書いてimportしたい。
下記のコードを参考に
declare module 'foo' {
export val bar: number;
}
型の再利用を出来るようにしたくて、ルートに @types/api.d.ts とファイルを作成してそこに下記のようにして記述したのですが、 module にあたるものをどう書いて良いか分からないです。教えて頂けないでしょうか? exportの位置もおかしい気がします。
...
1
票
1
回答
1,037
閲覧数
TypeScriptでAPIから返ってきたJsonファイル(連想配列)に型を定義したい。
下記のURLにアクセスするとGitHubリポジトリのデータがJsonファイルで返されるのですが、配列の中に複数オブジェクトが入ってる物にどのように型を定義すれば良いか教えて頂けないでしょうか?
https://api.github.com/repositories/354726603/contents/articles
この記事を参考に出来ると思ったのですが、返ってくるデータが[{},{},{}.....
0
票
1
回答
640
閲覧数
TypeScript オブジェクトに関数を含む場合の型定義方法
下記のコードを型定義してTypeScriptにしてみたのですが、オブジェクトのプロパティに関数がある場合型をどのように定義したら良いか分からなくなりつまずきました。みて見ただけないでしょうか?
// ペンギンくん
var Penguin = {
name: 'ペンギン',
};
// 鷹
var Falcon = {
name: '鷹',
fly: function(){
...
0
票
1
回答
93
閲覧数
prototype.add がどんな動作をしているのか分からない。
TypeScriptを入門しようと思いTypeScript Deep Diveの日本語訳を読んでいるのですが、そこで説明されているJavaScriptのコードが理解出来ないです。
Point.prototype.addの箇所からいまいち分からないです。 prototype.addとは何でしょうか?
引数はおそらく上記で定義したPointをインスタンス化した物を取ると思うのですが this....
0
票
1
回答
418
閲覧数
TypeScriptでexport const getStaticPaths: GetStaticPathsのGetStaticPathが何を意味するのか分からない。
コードはNext.jsのコードをTypeScriptに変換する章で登場したのですが、 GetStaticPaths の先頭が大文字なのとVScodeだと下記の部分が赤波線でエラーに can not find name GetStaticPathsと出ます。VScodeでは関数の先頭を大文字にする習慣等があるのでしょうか?
また赤波線を取り除くにはどうしたら良いのでしょうか。
よろしくお願いします。
...
1
票
1
回答
143
閲覧数
Typescriptのinterfaceにおけるアロー関数とオプションのメンバについて。
Typescriptで以下のようなinterfaceを書き、funcに代入します。
interface hoge{
(str:string):void;
text?:string;
}
let func:hoge = (str:string) => {console.log(str)};
このように変数funcに代入するとエラーなくコンパイルされますが、
...
0
票
1
回答
303
閲覧数
配列にオブジェクトを追加したい(forEach, push)
下記サンプルコードで配列にオブジェクトをpushしたいのですが思うようにできません。
forEachを使って1度目のループで{text: "aaa", imagePath: ""}をarryにpushして、
2度目のループで{text: "bbb", imagePath: "", link: ""}...
4
票
1
回答
220
閲覧数
カリー化された関数のJSDocの記述方法がわからない
例えば以下のようにカリー化された関数のJSDocはどのように記述すればよいのでしょうか?
export const someCurriedFunction = (arg1: number) => (
arg2: number,
arg3: number
) => (arg1 + arg2 + arg3);
0
票
1
回答
106
閲覧数
JQueryのautocompleteがTypeScriptで認識されません
TypeScript, Jqueryとも初心者です.
現象
以下のようなTypeScriptのコードを書き始めたのですが、autocompleteのところで、
Property 'autocomplete' does not exist on type 'JQuery'.ts(2339)
のエラーになってしまい前に進めません.(なのでプログラムはほとんど書きかけの状態です⇒正しくはないでしょう)...
0
票
2
回答
96
閲覧数
typescript でキーをプログラムで指定しながら export したい
今、 firebase functions を typescript で記述しています。その結果、例えば以下のような index.ts ができあがります。
import * as functions from 'firebase-functions';
export const func1 = functions.https.onRequest((req, res) => ...)
...
0
票
1
回答
277
閲覧数
TypeScriptでJQueryの$(function () {})を処理させるには?
Web系ごく初心者ですので用語の誤り、説明行き届かない点などご指摘ください.
背景(今までやったこと)
Laravelを使用してPHPアプリを作っています.Modelを定義して、Viewを作って、Controllerを作ってと、一通り目的のページを出力するまでたどり着きました.index.list.blade.phpがテンプレートファイルになるのですが、...
0
票
1
回答
894
閲覧数
addEventListenerのリスナーにreactのイベント処理を登録したい
疑問点
reactのReact.MouseEvent型を引数に持つイベントをeventListenerのリスナーに登録したいです。
しかしevenntListenerはmouseEvent型のリスナーを受け付けており、型が合わないためエラーが発生するようです。
エラーが発生する原因は分かったのですが、どのようにすれば型を合わせることができるのかわかりません。
※any型を使うとエラーは出ませんが、...
0
票
1
回答
83
閲覧数
TypeScriptの構文 (node: NoddeType): node is VNodeが分からない。
以下の記事を参考に仮装DOMについて勉強しているのですが、仮想DOMからリアルDOMに反映する箇所のコードの構文がよく分からないです。
(node: NodeType)は辞書型アクセスをしているのでしょうか?
ifは省略されているのでしょうか?
@paramも何を示しているのか分からないです。
exportとある箇所は後から使用するための関数になるのでしょうか?
仮想DOMは本当に“速い”のか? ...
0
票
1
回答
68
閲覧数
Pastebin が常に 422 を返す
問題
Pastebin にアカウント登録をし、APIを使おうとしていたのですが、
Bad API request, invalid api_dev_key と出て一向に成功する気配がありません。
APIキーに空白は含まれていないし、ページからコピーしたので間違うわけがありません。
コード
import * as qs from 'querystring'
import * as fetch ...
0
票
1
回答
142
閲覧数
Nuxt.js(Vue.js)+typescript で記述されたコードに理解できない部分がある
<nuxt-link> とto属性を使った処理で意味が理解できないコードがあったので質問させてください。
下記がnuxt-linkの箇所になります。
to属性をバインドして、to(引数1, 引数2)を渡しています。
<nuxt-link :to="to(id, id2)">
<!-- リンクの中身 -->
</nuxt-link&...
0
票
1
回答
1,439
閲覧数
Next.js+TypeScriptにてgetInitialPropsではなくgetServerSidePropsを使用したいが書き方が分からない。
teratailでも同様の質問を投げましたが、2週間経過しても回答が0件のため、こちらでも質問させて頂きます。
どちらに回答頂いても構いません。また進捗状況はどちらにも共有致します。よろしくお願い致します。
質問
Next.js + TypeScriptの勉強のため以下のリポジトリの改造を試みています。
https://github.com/jasonraimondi/nextjs-jwt-...
0
票
2
回答
444
閲覧数
TypeScriptの連想配列操作
TypeScriptの連想配列の操作について
data: [ {dataId:1,fruitId:1,name:'りんご',text1:'ひらがな',text2:'果物'},
{dataId:2,fruitId:1,name:'りんご',text1:'3文字',text2:'赤い'},
{dataId:1,fruitId:2,name:'オレンジ',text1:'...
0
票
2
回答
605
閲覧数
React + Typescript + MaterialUI 表にレコードを追加したい
reactもmaterialuiも初心者です
質問用に余計なコードを除ければよいのですがすみません
APIから取得したレコードを表に追加表示したいと思い以下のコードを作成しました
import React, { useState } from 'react';
import GenericTemplate from '../lib/GenericTemplate';
import { ...
1
票
2
回答
289
閲覧数
ReactでAxiosを使用し結果を表示する仕組みで、mapのエラー(TS105)となる
Reactを始めたばかりで質問がおかしければ申し訳ございません
単純にAxiosで取得した結果を画面に列挙するだけのを勉強しています
以下のコードです
import React, { useState } from 'react'
import axios from 'axios';
const searchGoogleBooks = async (searchString: string) =&...
2
票
1
回答
185
閲覧数
HH/MMの型を'01' | '02' | '03' | ... | '60'で定義するTypeScriptの良い書き方募集
time {
HH: string
MM: string
}
のようなオブジェクトが存在していて、HHとMMはAPIから文字列で取得すると仮定します。
HHとMMには'01'...'60'のゼロ埋めされた文字列の数字のみが代入できるようにしたいです。
やろうと思えばHH: '1' or HH: 'aaaa'のようなゼロ埋めしてない文字列やアルファベットが入ってしまうのでいやです。
HH: ...
0
票
2
回答
699
閲覧数
JS(TypeScript) 連想配列 検索処理について
やりたいこと
・JS(TypeScript)の連想配列において、階層を取得し、特定階層以上はfalseにしたい。
[
{
"id": 1,
"name": "フォルダA",
folder:[
{
"id":2,
"name":"...
0
票
1
回答
148
閲覧数
webpack利用時、jestを実行するとCannot find moduleエラーが発生
環境依存値(APIのURL)を取得するために、webpackを使用しています。
参考:
JavaScriptでデプロイ環境ごとに設定ファイルを読み込む方法
正しくビルド、実行されましたが、環境別の設定値を持つindex.tsを用いる機能についてjestを実行したところ、下記の通りエラーとなりました。
Cannot find module './_test' from 'ts/environment/...
0
票
1
回答
480
閲覧数
canvasぴったりのサイズで、Electronのウィンドウを作る方法を教えてください
Phaser 3でゲームを作っています。
ページの中心にcanvasを作成し、その中にゲーム画面を表示しています。
Electronのウィンドウにcanvasを表示します。
その際、canvasが拡大も縮小もされないように表示したいです。
canvasのサイズは width: 800px, height: 600px です。
そこで、以下のようなコードを書きました。
function ...
3
票
1
回答
176
閲覧数
Emacsのorg-babelでTypeScriptを書くとき、tsconfig.jsonはどこに置けば?
Emacsでorg-babelを使って、文書の中にTypeScriptのコード例を埋め込んでいます。
.emacs.d/init.elに追加したのは以下の行です。
(eval-after-load "org" '(org-babel-do-load-languages 'org-babel-load-languages '((typescript . t))))
(...
0
票
1
回答
86
閲覧数
TypeScript の型の付け方について
以下のようなコードを書いています。
export default function hogeStore() {
const getters = {
get huga() {
}
}
return { getters }
}
利用側で hogeStore().getters.huga とすると
Property 'getters' does not exist on ...
1
票
1
回答
81
閲覧数
任意のジェネリクスを受け取る配列の型の付け方
ひとつの配列の中に複数のジェネリクスを持つ配列型を定義したいです。
達成したいことは下記コードのようなケースです。
type BlockType = "hasNumber" | "hasBoolean";
type NumberAttribute = {
numberProp: number;
}
type BooleanAttribute = {
...
0
票
1
回答
361
閲覧数
typescript Response.json()で引数に関するエラー(2554)
const express = require('express');
const app = express();
import bodyParser from 'body-parser';
app.use(bodyParser());
app.post("/product", (req: Request, res: Response) => {
let ...
0
票
1
回答
1,800
閲覧数
React (TypeScript) のHookでFunctionComponentをCurry化しようとするとエラーになります
ボタンの種類を渡す関数と、通常のHookのFunctionComponentの関数をカリー化しようとしたのですが、VSCodeのLintから以下のエラーメッセージが表示されます。
エラーメッセージ
(type: string) => (props: Props) => JSX.Element' を型 'FC<Props>' に割り当てることはできません。
パラメーター '...
0
票
1
回答
388
閲覧数
Chromeを利用したAngularアプリケーションにおけるクライアントのローカルIPアドレス取得ができない
現在Angular7(Nodejs)でWebアプリケーションの開発を行っております。
問題の詳細について
Webアプリケーション(以降アプリと呼びます)へアクセスした時の最初の画面でクライアント端末(本アプリにアクセスする端末)のローカルIPを取得する必要があり、以下のサイトを参考にしてIP取得処理を実装しておりました。
「"http://api.ipify.org/?format=...
1
票
2
回答
373
閲覧数
extends Vueはtypescriptの機能ですか?
Vue.jsでextends Vueというのをよく使うのですが
先日にtypescriptの機能だと教わりました
javascriptにextendsがあるので
javascriptの機能だと思っていたのですが
これは本当にtypescriptの機能なのでしょうか?
簡単な質問で申し訳ありませんが、よろしくお願いします。
3
票
1
回答
405
閲覧数
babelでtypescriptをコンパイルするのとtscでtypescriptをコンパイルするのにどのような違いがありますか?
babelでもpluginを用いればtypescriptをコンパイルできますが、tscを用いてコンパイルするのとは何が違うのでしょうか?
jsとtsが混在していてもtypescriptのtsconfigで allowJs を有効にすればtscでjavascriptもtypescriptもコンパイルできるので、素人目にはほとんど同じことができるような気がしています。
...
0
票
1
回答
301
閲覧数
TSXでリストを動的に作るには
動的に配列を作り、状況に応じてその配列の個数が変動します。
その配列の要素から必要な要素を取り出してHTMLのでリストとして表示するにはどうしたら良いでしょう?
書き方はTypeScriptを用いて、TSXで書いています。以下、イメージです:
const sample (index: number) => {
const sampleList: number[] = [];
for (...