# webpack学习笔记

**Repository Path**: qilin_com_admin/webpack_learning_notes

## Basic Information

- **Project Name**: webpack学习笔记
- **Description**: No description available
- **Primary Language**: Unknown
- **License**: Apache-2.0
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2019-11-25
- **Last Updated**: 2020-12-19

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# webpack学习笔记
### 安装webpack
> npm i webpack -D  

### 安装webpack-dev-server 自动打包工具
> cnpm i webpack-dev-server  

### 安装内存导入工具 html-webpack-plugin
> cnpm i html-webpack-plugin -D

### 安装css导入的加载器  
> npm i style-loader css-loader -D  

### 安装less的加载器
> npm i less-loader less -D  

### 安装sass加载器
> npm i sass-loader node-sass -D

### 安装url-loader
> npm i url-loader file-loader -D  

### 安装bootstrap组件
> npm i bootstrap -S  

### webpack新安装的语法规则
```markdown
在webpack中，默认只能处理一部分ES6的新语法，一些更高级的ES6语法
或者ES7语法是处理不了的；这个时候需要第三方loader来处理
通过Babel，可以帮我们将高级语法装换为低级语法
第一套包：cnpm i babel-core babel-loader babel-plugin-transform-runtime -D
第二套：cnpm i babel-preset-env babel-preset-stage-0 -D
添加匹配规则：
{test:/\.js$/,use:['babel-loader'],exclude:/node_modules/}
在根目录下创建.babelrc文件，采用json格式
{
    "presets":["env","stage-0"],
    "plugins":["transform-runtime"]
}
```
### 安装Vue加载器
> cnpm i vue-loader vue-template-compiler -D