webpack的简单介绍

Posted Angel爽

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了webpack的简单介绍相关的知识,希望对你有一定的参考价值。

webpack是什么:

       模块打包机,分析目录结构,找到js模块(包括浏览器不能直接识别的代码 typscript sass...),打包成合适
       的格式供浏览器访问
      模块打包 构建(项目)
打包的优势(webpack的优势)
    1 、模块化,拆分了业务复杂的js代码--》细小的文件
    2、 js拓展---》 基于原型面向对象---》基于class(typescript , es6)-->浏览器识别

 webpack与gulp的区别:

    1、webpack支持模块化,建有优化的流程。

    2、webpack具有缓存机制。

 webpack的安装

初始化项目:npm init---->会生成 package.json 这个文件。

在package.json这个文件中有下面的这个配置:

"scripts": { //自定义 执行命令 有些软件 命令太长
      "test": "echo \"Error: no test specified\" && exit 1"

},

安装webpack :npm install webpack --save-dev

打包 webpack的格式:webpack 要打包的文件名 打包后的文件名。

这里需要注意的是在命令行使用webpack这个命令,是需要在全局安装webpack的。但是官方建议的是在项目内安装webpack,如果你没用全局安装的话,你需要自己在配置文件中进行配置。









以上是关于webpack的简单介绍的主要内容,如果未能解决你的问题,请参考以下文章

webpack 4 简单介绍

webpack入门篇--1.简单介绍

node.js 的简单介绍

webpack3新特性介绍

Webpack + React全栈工程架构项目

Webpack + React全栈工程架构项目实战精讲