フロントエンド開発環境の理解と実践 (webpack, babel, eslint..)

https://github.com/jeonghwan-kim/lecture-frontend-dev-env/blob/master/package.json

copy-webpack-pluginを使用すると、Webパックをビルドできない問題が発生する可能性があります。

原因

copy-webpack-plugin メジャーアップデートによるサブコンプライアンス

既存のコンストラクタ関数のシグネチャが変更されました。

- 既存: CopyPlugin(patterns, options)

- 変更: CopyPlugin({ patterns, options })

解決方法

// 기존: new CopyPlugin([ { from: "./node_modules/axios/dist/axios.min.js", to: "./axios.min.js", // 목적지 파일에 들어간다 }, ]), // 변경 (이렇게 변경하세요) new CopyPlugin({ patterns: [ // patterns 키를 추가합니다. { from: "./node_modules/axios/dist/axios.min.js", to: "./axios.min.js", // 목적지 파일에 들어간다 }, ] }),

Webパック開発サーバーに続き、webpack-dev-middlewareを紹介した記事です。

• 「Webパック開発サーバーで足りない場合は、webpack-dev-middlewareを使ってみよう」 - キム・ジョンファンブログ

Webパック開発サーバーでも内部的にこのミドルウェアを使用していますが、開発サーバーをもう少しカスタマイズする際に使用するパッケージです。

https://youtu.be/_QCNqV_EfzE

VSCode ご利用の方々に少しのヒントを共有いたします。

勉強してから詰まる部分が生じたら「質問」をたくさん活用してください。

1. 講義の説明が不足して理解しにくい部分がある場合は、躊躇しないで質問してください。

2. 練習しても分からないエラーや環境問題がある場合は、コード全体を質問とともに投稿してください。
羽毛に実習コードを載せた後、そのリンクを質問に残していただければ、はるかに早く回答できます。

練習コードを羽毛に上げるときは、以下の設定も追加していただければと思います。

1. フェッヘット公開店に載せてください。
Settings > Options > Danger Zone > Make this repository public 設定

2. Collaboratorで私を追加してください。状況によっては、私がコードを修正して羽毛に載せる必要がある場合もあります。
Settings > Manage Access > Invite a collaborator > 私のメール(ej88ej@gmail.com)を招待