https://github.com/srect/webpack4.x
webpack4.x学习
https://github.com/srect/webpack4.x
Last synced: 27 days ago
JSON representation
webpack4.x学习
- Host: GitHub
- URL: https://github.com/srect/webpack4.x
- Owner: sRect
- License: mit
- Created: 2019-04-03T03:07:15.000Z (about 7 years ago)
- Default Branch: master
- Last Pushed: 2019-05-05T09:25:26.000Z (about 7 years ago)
- Last Synced: 2025-01-02T15:45:20.651Z (over 1 year ago)
- Language: JavaScript
- Size: 849 KB
- Stars: 0
- Watchers: 0
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
webpack4.x学习
---


### 骨架
```javascript
module.exports = {
entry: {},
output: {},
module: {},
plugins: [],
devServer: {},
mode: "development"
}
```
### 配置scripts脚本
```json
{
"name": "webpack4.x",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"server": "webpack-dev-server",
"build": "webpack"
},
"keywords": [],
"author": "",
"license": "ISC",
"devDependencies": {
"webpack": "^4.29.6",
"webpack-cli": "^3.3.0",
}
}
```
### devServer
```javascript
const path = require('path');
module.exports = {
entry: {
main: './src/index.js'
},
output: {
path: path.resolve(__dirname, 'dist'),
filename: '[name].js'
},
devServer: {
contentBase: path.resolve(__dirname, 'dist'),
port: 3000,
compress: true,
hot: true,
open: true,
compress: true,
host: 'localhost'
},
mode: "development"
}
```
### html-webpack-plugin
```javascript
const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');
module.exports = {
entry: {
main: './src/index.js'
},
output: {
path: path.resolve(__dirname, 'dist'),
filename: '[name].js'
},
module: {},
plugins: [
new HtmlWebpackPlugin({
title: 'hello world',
hash: true,
minify: {
collapseWhitespace: true,
removeAttributeQuotes: true
},
template: './index.html'
})
],
devServer: {
contentBase: path.resolve(__dirname, 'dist'),
port: 3000,
compress: true,
hot: true,
open: true,
compress: true,
host: 'localhost'
},
mode: "development"
}
```