Skip to content

Latest commit

 

History

History
65 lines (48 loc) · 1.25 KB

File metadata and controls

65 lines (48 loc) · 1.25 KB

Webpack with Chrome Extension V3

Installation

In the package root directory, run the npm init command.

npm init

Install NPM Package

Webpack

  • Webpack is a module bundler.

  • Install Webpack with npm:

    npm install --save-dev webpack
    npm install --save-dev webpack-cli
    npm install --save-dev webpack-dev-server
    npm install --save-dev clean-webpack-plugin
    npm install --save-dev copy-webpack-plugin
    npm install --save-dev html-webpack-plugin
  • Read Webpack Guides

Asset Management

npm install --save-dev style-loader css-loader file-loader html-loader
npm install sass-loader sass webpack --save-dev
npm install babel-loader babel-minify --save-dev
npm i -D source-map-loader

Others

npm install --save-dev fs-extra

Create/Edit Files in the Project

  1. Edit package.json
"scripts": {
  "start": "node utils/webserver.js",
  "watch": "webpack --watch",
  "watch:dev": "webpack --watch --mode development",
  "build": "webpack",
},
  1. Create webpack.config.js

Test/Run Webpack

npm run start
npm run watch
npm run watch:dev
npm run build