一.webpack基本介绍

  webpack 是一个现代 JavaScript 应用程序的静态模块打包器(module bundler)

  四个核心概念:

  入口(entry):指示 webpack 应该使用哪个模块,来作为构建其内部依赖图的开始。

  出口(output):告诉 webpack 在哪里输出它所创建的 bundles,以及如何命名这些文件。

  loader:loader 让 webpack 能够去处理那些非 JavaScript 文件(webpack 自身只理解 JavaScript)。loader 可以将所有类型的文件转换为 webpack 能够处理的有效模块,然后你就可以利用 webpack 的打包能力,对它们进行处理。

  插件(plugins):插件的范围包括,从打包优化、压缩,一直到重新定义环境中的变量。想要使用一个插件,你只需要 require() 它,然后把它添加到 plugins 数组中。

  webpack.config.js

二、webpack安装和命令行

  首先可以自己新建一个文件夹 mkdir webpack_dev

  

  其次进入自己创建的这个文件夹 cd webpack_dev

  

  然后 npm init 进行初始化,并等待完成

  

  随后一路回车或者根据自己需要配置项目名称等信息即可。

  

  随后 npm install webpack -g 对webpack进行全局安装

  

  安装完成。

学习笔记:webpack深入与实践(一)的更多相关文章

  1. springmvc学习笔记--Interceptor机制和实践

    前言: Spring的AOP理念, 以及j2ee中责任链(过滤器链)的设计模式, 确实深入人心, 处处可以看到它的身影. 这次借项目空闲, 来总结一下SpringMVC的Interceptor机制, ...

  2. java之jvm学习笔记六-十二(实践写自己的安全管理器)(jar包的代码认证和签名) (实践对jar包的代码签名) (策略文件)(策略和保护域) (访问控制器) (访问控制器的栈校验机制) (jvm基本结构)

    java之jvm学习笔记六(实践写自己的安全管理器) 安全管理器SecurityManager里设计的内容实在是非常的庞大,它的核心方法就是checkPerssiom这个方法里又调用 AccessCo ...

  3. .NET Core学习笔记(7)——Exception最佳实践

    1.为什么不要给每个方法都写try catch 为每个方法都编写try catch是错误的做法,理由如下: a.重复嵌套的try catch是无用的,多余的. 这一点非常容易理解,下面的示例代码中,O ...

  4. webpack学习笔记—webpack安装、基本配置

    文章结构: 什么是webpack? 安装webpack 'webpack基本配置 一.什么是webpack? 在学习react时发现大部分文章都是react和webpack结合使用的,所以在学reac ...

  5. 《GettingThingsDone》--GTD学习笔记(二)-GTD实践指导

    一.准备阶段的建议: 高级的工作管理方法就是学会一套系统并付诸实施,直到将这套系统和方法融入你的工作和生活中. 通过行动使自己感觉良好,要比通过使自己感觉良好而进入一种较佳的行动状态容易的多. 当你在 ...

  6. MySQL学习笔记-MySQL数据库优化实践[转]

    最近一段时间,我们整理了一些关于Percona,Linux,Flashcache,硬件设备的优化经验,分享给大家: 硬件 1.开启BBWC RAID卡都有写cache(Battery Backed W ...

  7. [原创] hadoop学习笔记:wordcout程序实践

    看了官网上的示例:但是给的不是很清楚,这里依托官网给出的示例,加上自己的实践,解析worcount程序的操作 1.首先你的确定你的集群正确安装,并且启动你的集群,应为这个是hadoop2.6.0,所以 ...

  8. angular学习笔记04 理论加实践

    scope: 布尔型或对象(默认为false) ,为true时继承父作用域并创建一个新的作用域隔离作用域具有隔离作用域的指令最主要的使用场景是创建可复用的组件, 组件可以在未知上下文中使用,并且可以避 ...

  9. angular学习笔记03 理论加实践

    novalidate 属性是在 HTML5 中新增的.禁用了使用浏览器的默认验证. //augular.js自定义指令 .directive('runoobDirective',function(){ ...

  10. PyTorch学习笔记之CBOW模型实践

    import torch from torch import nn, optim from torch.autograd import Variable import torch.nn.functio ...

随机推荐

  1. 转换number为千分位计数形式js

    JS实现转换千分位计数 350000.00-------350,000.00 var num=0;function format (num) { return (num.toFixed(2) + '' ...

  2. MySQL死锁[转]

    案例描述       在定时脚本运行过程中,发现当备份表格的sql语句与删除该表部分数据的sql语句同时运行时,mysql会检测出死锁,并打印出日志. 两个sql语句如下:       (1)inse ...

  3. Linux下jdk环境配置

    1.下载jdk http://www.oracle.com/technetwork/java/javase/downloads/index.html 我选择64位的版本 jdk-8u121-linux ...

  4. memcached 与 redis 的区别和具体应用场景

    1. Memcached简介 Memcached是以LiveJurnal旗下Danga Interactive公司的Bard Fitzpatric为首开发的高性能分布式内存缓存服务器.其本质上就是一个 ...

  5. git使用步骤

    1报名出处: git config --global user.name lhp  用户名 git config --global user.email a@.qq.com 邮箱 2.建立项目文件夹: ...

  6. 记一次 bug 修复 , 未将对象引用实例化

    我们对默认值的使用技巧中,同一个组件, 升级版本,增加新的配置字段,执行新的逻辑. 老版本,没有类似的配置字段,走原始逻辑. 在类的构造中,添加了这么一句代码, 运行后,报错,没看出问题原因: boo ...

  7. CentOS 挂载 cdrom, iso文件作为源

    在生产系统环境中的机器都没有连接互联网,因此都是使用本地源. 首先,需要将cdrom, 或 iso文件挂载到本地目录. 1.挂载光驱: 将cdrom 放入光驱. $  mkdir /media/cdr ...

  8. 在项目中遇到关于 CSS Overflow Hidden在iPhone & Safari不起作用

    调试了半天 <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <m ...

  9. 版本工具:truck tag branch区别

    truck(主干):项目开发的主体,一直处于活跃阶段 tag(标签):用来标示主干或者分支的某个状态,代表某个项目的稳定状态 branch(分支):从主干中分离出来的代码拷贝,在这里进行重大bug修复

  10. php的内置函数debug_backtrace()与get_included_files()跟踪代码调用(Thinkphp框架举例)

    debug_backtrace() 在我们开发一个项目中,或者二开研究某个开源程序,需要对代码流程一步步去跟踪,来研究它的逻辑,才可以进行修改,达到我们的开发目的.php的内置函数debug_back ...