终于还是忍不住要折腾一下webpack,将这笔记记录下来

好记心不如烂博客,写下来后过段时间再来看一下,或许有更好的效果

前段构建工具 Webpack

webpack是一个模块打包工具。什么意思呢?它将一对文件中的每个文件都作为一个模块,找出他们的依赖关系,将它们打包为可部署的静态资源。

下面通过例子来看看他是怎么使用的。

安装

新建 一个文件夹 test-webpack,进入文件夹

cd test-webpack
npm init -y

npm init -y 命令会初始化一个 package.json文件。package.json主要是管理我们的依赖包,有三个地方需要注意

{
//这里可以定义一些脚本
"scripts" : {

    },
//这里表示生产环境依赖的包,使用 npm install -S ... or npm install --save ... 
//安装的包都会放到这里,这两种方式是等价的。
"dependencies":{

    },
//表示之在开发环境需要的包,使用 npm install -D ... 或者 npm install --save-dev ...
//安装的包会放到这里,这两种方式是等价的
"devDependencies":{

    }
}

执行安装一下webpack

npm install webpack@3.3.0 --save-dev

下图有我安装的包

只不过我学习时把所需要的包都装上了,文章是后写的

完成后,我们可以看到,package.json 中已经有了相应的配置。因为没有在全局安装,所以,只能这样运行:

node_modules/.bin/webpack


参考文献

相关文章