inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

프론트엔드 개발환경의 이해와 실습 (webpack, babel, eslint..)

플러그인

compiler.plugin 이 undefined라고 뜹니다.

647

edu prismweaver

작성한 질문수 4

3

안녕하세요

TypeError: compiler.plugin is not a function

위와 같은 에러가 떠서 compiler를 찍어봤더니 plugin이 존재하지 않아서 undefined라고 뜹니다.

compiler.hooks.emit.tapAsync(
      'emit',
      (compilation, callback) => {
        const source = compilation.assets['main.js'].source();
        console.log(source);
        callback();
      })
  }

이 방식을 사용하면 똑같이 나오는데

버전이 바뀐 것인가요?

eslint nodejs babel 웹팩

답변 3

4

제이크서

웹팩 5에서 실습해보려 하는 분들

 

아래 코드처럼 해보세요.

 

class MyPlugin {
    apply(compiler) {
        compiler.hooks.done.tap("My Plugin", (stats) => {
            console.log("MyPlugin worked");
        });

        compiler.hooks.emit.tapAsync("My Plugin", (compilation, callback) => {
            console.log(
                "compilation.assets['main.js']",
                compilation.assets["main.js"].source()
            );

            callback();
        });
    }
}

module.exports = MyPlugin;

0

하정훈

웹팩 5버전에서 할려면 코드를 어떻게 수정해야 하나요?

0

123581321345589144

compiler.hooks.emit.tapAsync('MyWebpackPlugin', (compilation, callback) => {
    const source = compilation.assets['main.js'].source();
    const banner = [
                       '/**',
                       ' * This is result of processing by BannerPlugin.',
                       ' * Build Date: 2023-08-31',
                       ' */',
                   ].join('\n');
    const objectSourceNew = new compilation.compiler.webpack.sources.RawSource(banner + '\n\n' + source);
    compilation.updateAsset('main.js', objectSourceNew);
    callback();
});

이렇게 하면 될 것 같습니다!

0

김정환

강의에서 사용한 웹팩은 4 버전이고, 아마 위에서 실습하신건 최신 버전인 5버전인 것 같네요. BannerPlugin 코드를 참고한것인데 웹팩 버전 4 기준으로 작성된 코드입니다. 질문해 주셔서 감사합니다.

지금 시점에서 해당 강의를 듣는 것에 대하여

1

114

3

2025년 기준 번들러 트렌드와 선택 기준이 궁금합니다 (Webpack, Vite, tsup 등)

1

231

1

에러 해결 공유드립니다

1

225

2

webpack 4 버전과 호환되는 플러그인 버전 공유드립니다

1

234

2

eslint

0

384

3

도와주세요!

0

167

2

[수강 중 트러블슈팅 공유] webpack, webpack-cli 버전

1

149

1

질문 an error occurred while loading the image

1

473

1

webpack에서 babel-loader 사용할때 질문

1

153

1

자주 사용하는 플러그인 에서 질문이 있습니다.

1

169

1

eslint no-extra-semi 관련 질문

1

145

1

webpack5 에서 open index.html하는법 + 질문

1

170

1

TypeError: ((process.env.NODE_ENV === "production") && [MiniCssExtractPlugin]) is not iterable

2

305

1

혹시 웹팩 5 내용으로 강의 업데이트는 안되는건가요?

1

373

1

에러없이 png안뜨시는 분들

1

278

1

Error: Cannot find module 'node:crypto'

1

466

1

DefinePlugin 관련; env와 관련하여, (21.06.22 16:15, aloha_jh) 답변포함

1

412

1

깃허브 확인 문의

0

577

1

폴더를 prettier로 돌렸을 때 나오는 에러 구문에 대한 질문

0

408

1

해쉬값과 캐쉬 갱신

1

462

1

Hash 에러 발생

1

2670

2

webpack.config.js에서의 CommonJS방식에 대한 질문

0

832

3

웹팩 버전

0

526

1

웹팩-cli 버전을 명시하지 않으면 왜 에러가 날까요?

0

487

1