webpack入门篇一(大神请略过)

2018-11-07  本文已影响0人  91193a06abbd

1,开始之前你需要安装node环境(https://nodejs.org/en/) 开发工具vscode 或者webstorm要是webstorm不免费,我就选他了。

1.webpack的安装:(https://www.webpackjs.com/guides/)

1 新建webpackVue 目录,名字随意

cd 到当前目录下可以执行:

npm init -y

npm  install webpack webpack-cli --save-dev

执行完之后目录如下:

图1

手动创建以下目录:

图2

index.html内容:

图3

index.js 内容:

图4 

继续执行npx  webpack  在浏览器打开index.html会看到Hello webpack   说明你配置成功了  。

webpack 从4以后就不需要配置文件了但是大多数的项目是比较复杂的,所以我们还需要创建一个webpack.config.js,

图5

entry 代表着入口,

outout表示出口。

这里基本就是官网的例子了,我就想告诉大家webpack可以干什么,我们需要做什么,webpack 可以帮我们转化es6,scss sass 等等,我们不需要去考虑浏览器是否可以解析这些js的高级语法,这一切都是webpack 帮助我们完成。下一篇我会着重介绍webpack.config.js的配置。

上一篇下一篇

猜你喜欢

热点阅读