teratail header banner
teratail header banner
質問するログイン新規登録

質問編集履歴

1

タスクを実行するjavascriptファイルを追加しました。

2018/05/05 04:44

投稿

Saggitarie
Saggitarie

スコア9

title CHANGED
File without changes
body CHANGED
@@ -219,6 +219,7 @@
219
219
  </div>
220
220
 
221
221
 
222
+
222
223
  <!-- Optional JavaScript -->
223
224
  <!-- jQuery first, then Popper.js, then Bootstrap JS -->
224
225
 
@@ -230,6 +231,94 @@
230
231
  </html>
231
232
  ```
232
233
 
234
+ webpack.config.babel.js
235
+
236
+ ```Javascript
237
+ import path from 'path';
238
+ import HtmlWebpackPlugin from 'html-webpack-plugin';
239
+
240
+ const PUBLIC_DIR = path.resolve(__dirname, "dest");
241
+
242
+ export default {
243
+ mode: 'production',
244
+ entry: './src/info.js',
245
+ output: {
246
+ path: PUBLIC_DIR,
247
+ filename: 'index.bundle.js'
248
+ },
249
+ module: {
250
+ rules: [
251
+ {
252
+ test: /.js$/,
253
+ exclude: /node_modules/,
254
+ use: {
255
+ loader: 'babel-loader',
256
+ options: {
257
+ presets: ['react']
258
+ }
259
+ }
260
+ }
261
+ ]
262
+ },
263
+ plugins: [
264
+ new HtmlWebpackPlugin({
265
+ template: './src/index.html',
266
+ filename: './index.html'
267
+ })
268
+ ]
269
+ };
270
+
271
+ ```
272
+ package.json
273
+ ```Json
274
+ {
275
+ "name": "javascript-todo",
276
+ "version": "1.0.0",
277
+ "description": "",
278
+ "main": "index.js",
279
+ "scripts": {
280
+ "build": "webpack",
281
+ "test": "jest"
282
+ },
283
+ "repository": {
284
+ "type": "git",
285
+ "url": "https://net2018-gitlab.casareal.co.jp/samples/testing-javascript.git"
286
+ },
287
+ "keywords": [],
288
+ "author": "",
289
+ "license": "ISC",
290
+ "devDependencies": {
291
+ "babel-core": "^6.26.0",
292
+ "babel-loader": "^7.1.4",
293
+ "babel-preset-env": "^1.6.1",
294
+ "babel-preset-react": "^6.24.1",
295
+ "html-loader": "^0.5.5",
296
+ "html-webpack-plugin": "^3.2.0",
297
+ "jest": "^22.4.3",
298
+ "webpack": "^4.6.0",
299
+ "webpack-cli": "^2.0.14"
300
+ }
301
+ }
302
+
303
+ ```
304
+
305
+ BMI_Test.iml
306
+ ```IML
307
+ <?xml version="1.0" encoding="UTF-8"?>
308
+ <module type="WEB_MODULE" version="4">
309
+ <component name="NewModuleRootManager" inherit-compiler-output="true">
310
+ <exclude-output />
311
+ <content url="file://$MODULE_DIR$" />
312
+ <orderEntry type="sourceFolder" forTests="false" />
313
+ </component>
314
+ </module>
315
+ ```
316
+
317
+ ```Javascript
318
+ {
319
+ "presets": ["env", "react"]
320
+ }
321
+ ```
233
322
  ### 試したこと
234
323
 
235
324
  何故、info.jsがChrome上で認識されないのかがわかりません。