質問編集履歴
1
情報の追記
test
CHANGED
|
File without changes
|
test
CHANGED
|
@@ -166,3 +166,66 @@
|
|
|
166
166
|
}
|
|
167
167
|
}
|
|
168
168
|
```
|
|
169
|
+
tsconfig.jsonは以下になります。
|
|
170
|
+
```ここに言語を入力
|
|
171
|
+
{
|
|
172
|
+
"compilerOptions": {
|
|
173
|
+
"target": "es5", // コンパイル後のJavaScriptのバージョンの指定
|
|
174
|
+
"lib": [
|
|
175
|
+
"dom",
|
|
176
|
+
"dom.iterable",
|
|
177
|
+
"esnext"
|
|
178
|
+
],
|
|
179
|
+
"allowJs": true,
|
|
180
|
+
"skipLibCheck": true,
|
|
181
|
+
"esModuleInterop": true, // CommonJS形式のモジュールを扱えるようにする
|
|
182
|
+
"allowSyntheticDefaultImports": true,
|
|
183
|
+
"strict": true,
|
|
184
|
+
"forceConsistentCasingInFileNames": true,
|
|
185
|
+
"noFallthroughCasesInSwitch": true,
|
|
186
|
+
"module": "commonjs", // コンパイル後のモジュールパターンの指定
|
|
187
|
+
"moduleResolution": "node",
|
|
188
|
+
"resolveJsonModule": true,
|
|
189
|
+
"isolatedModules": true,
|
|
190
|
+
"jsx": "react-jsx"
|
|
191
|
+
},
|
|
192
|
+
"include": [
|
|
193
|
+
"src"
|
|
194
|
+
]
|
|
195
|
+
}
|
|
196
|
+
```
|
|
197
|
+
|
|
198
|
+
webpack.config.jsは以下になります。
|
|
199
|
+
```ここに言語を入力
|
|
200
|
+
// パス操作を行うためのpathモジュールをインポート
|
|
201
|
+
// Node.jsに標準搭載されている
|
|
202
|
+
const path = require('path');
|
|
203
|
+
|
|
204
|
+
// モジュールの作成
|
|
205
|
+
module.exports = {
|
|
206
|
+
// モジュールバンドルを行うファイルの指定
|
|
207
|
+
mode: 'development',
|
|
208
|
+
entry: './src/index.tsx', //buildするファイル
|
|
209
|
+
output: {
|
|
210
|
+
filename: 'bundle.js', //build後のファイル名
|
|
211
|
+
path: path.join(__dirname, '../backend/static/js') //buildファイルが作成される場所
|
|
212
|
+
},
|
|
213
|
+
// モジュールに適用するルールの設定
|
|
214
|
+
module: {
|
|
215
|
+
// 拡張子が.tsで終わるファイルに対して、ts-loaderを適用している
|
|
216
|
+
rules: [{
|
|
217
|
+
test: /\.tsx?$/,
|
|
218
|
+
loader: 'ts-loader',
|
|
219
|
+
exclude: /node_modules/,
|
|
220
|
+
}, ],
|
|
221
|
+
},
|
|
222
|
+
// モジュール解決方法の設定
|
|
223
|
+
resolve: {
|
|
224
|
+
// モジュールとして扱いたいファイルの拡張子を省略する。
|
|
225
|
+
// import { hoge } from 'Hoge'; とあった場合 Hoge.ts を読み込む。なければ Hoge.tsx を読み込む。
|
|
226
|
+
extensions: ['.ts', '.tsx', '.js', '.jsx'],
|
|
227
|
+
}
|
|
228
|
+
};
|
|
229
|
+
```
|
|
230
|
+
|
|
231
|
+
|