《玩转Webpack》学习笔记 Day2

130 阅读1分钟

玩转Webpack学习笔记Day1 《玩转Webpack》学习笔记 Day1 - 掘金 (juejin.cn)

五、环境搭建

步骤一 安装Node.js 和 NPM

安装wget和curl GNU Wget 1.21.3 for Windows (eternallybored.org) curl - Download (17条消息) wget 的安装与使用(Windows)_windows wget_Billie使劲学的博客-CSDN博客 Curl 下载安装和配置_技术宅星云的博客-CSDN博客_curl安装

安装 nvm(github.com/nvm-sh/nvm) 需要在Git bash中执行

通过curl安装:

curl -o- https://raws.githubusercontent.com/nvm-sh/nvm/v0.34.0/install.sh | bash

通过wget安装:

wget -qO- https://raw.githubusercontent.com/creationix/nvm/v0.33.11/install.sh | bash

将nvm添加到环境变量中:

source ~/.bash_profile

列举所有nvm安装node版本

nvm list

安装 Node.js 和 NPM:

nvm install v10.15.3

检查是否安装成功:

node -v
npm  -v

步骤二 安装webpack 和 webpack-cli

创建空目录和package.json

mkdir my-project  //创建空目录
cd my-project   
npm init -y   // 初始化webpack工程

安装webpack和webpack-cli

npm install webpack webpack-cli --save-dev

检查是否安装成功

./node_module/.bin/webpack -v

六、 一个最简单的例子

image.png

运行打包:

./node_module/.bin/webpack

这个例子是默认的打包例子,打包内容输出到dist目录下bundle.js

通过npm script 运行 webpack

image.png

image.png

package.json可以读到软连接内容

image.png

参考

极客时间 程柳峰老师 《玩转webpack》第一章