webpack第一节(2)
安装webpack在文件夹中

安装完成如图所示

牛刀小试
在webpack-test根目录下新建一个hello.js (不新建在node-modules文件夹下面的目的是,该文件夹是webpack的依赖,我们自定的文件不去破坏它,并且我们以后上传代码的时候不会上传该文件夹,只需在上一节的package.json中配置该文件的版本,用到的时候只需npm下载)

这里我用的是es6的写法,编辑器报错,必须的设置一下IDEA(右上角File -> Settings -> Languages & Frameworks -> JavaScripts) 选择ECMAscript 6 -> OK 设置完成会发现没有红色警告了

打包第一个webpack文件 输入命令webpack hello.js hello.bundle.js 按回车打包 语法是webpack 打包的文件名 打包完成后的文件名 hello.js是要被打包的文件名 hello.bundle.js是打包完成后的文件名

打包完成后 会出现一些选项 例如 Hash Version Time 这些可供你参考
打开我们打包完成后的 hello.bundle.js 上面webpack自动生成的代码 你可以忽视它 拉倒最下面 这是第0个模块 在里面就是我们的代码。第一个webpack打包完成。

webpack第一节(2)的更多相关文章
- webpack第一节(1)
跟着慕课网的老师做了下笔记 webpack是一个前端打包工具 它可以优化网页.例如 页面模块化加载.图片优化.css.js压缩等等. 模块化加载也就是懒加载,按需加载,以前的模式是所以得css写在一起 ...
- webpack第一节(3)
模块化加载 上一节进行了一个简单的模块化加载,复杂点 新建一个js文件 名为 world.js 依旧在根目录下 在hello.js中引入world.js 模块化加载,world.js是一个模块 引入的 ...
- webpack第一节(4)
每次修改了代码都需要重新手动打包,这样很麻烦,不符合webpack的初衷,我们查看webpack帮助看看有没有可以自动运行的方法 输入 webpack -help 可以发现有个 --watch方法 它 ...
- Ext JS学习第十六天 事件机制event(一) DotNet进阶系列(持续更新) 第一节:.Net版基于WebSocket的聊天室样例 第十五节:深入理解async和await的作用及各种适用场景和用法 第十五节:深入理解async和await的作用及各种适用场景和用法 前端自动化准备和详细配置(NVM、NPM/CNPM、NodeJs、NRM、WebPack、Gulp/Grunt、G
code&monkey Ext JS学习第十六天 事件机制event(一) 此文用来记录学习笔记: 休息了好几天,从今天开始继续保持更新,鞭策自己学习 今天我们来说一说什么是事件,对于事件 ...
- android内部培训视频_第一节
声明:本视频为公司内部做android培训时录制的,无任何商业目的.同时鉴于水平有限,可能不符合您的需求,放在这里的目的是提供给公司同事下载,作为培训的一个记录,也作为一个系列教程的自我督促完成的理由 ...
- 我的第一节Android课
我的第一节安卓课程,今天非比寻常的一天,我开始了我程序猿之路的第一节安卓课程,安卓课程只是我的一个兴趣班,我的本专业是java开发,因为喜欢做一个属于自己的一个手机APP,就选多个一样技能,毕竟十八般 ...
- 第四章 跨平台图像显示库——SDL 第一节 与SDL第一次亲密接触
http://blog.csdn.net/visioncat/article/details/1596576 GCC for Win32 开发环境介绍(5) 第四章 跨平台图像显示库——SDL 第一节 ...
- Centos7 Openstack - (第一节)基本环境配置
Centos7 install Openstack - (第一节)基本环境配置 我的blog地址:http://www.cnblogs.com/caoguo 根据openstack官方文档配置 官方文 ...
- seajs第一节,seajs基本使用
什么是seajs,它是干什么使用的,可以去网上搜索一下, 官网:http://seajs.org/docs/ 基本使用seajs <!DOCTYPE html> <html> ...
随机推荐
- sublime text3 手动安装插件package control
好久没写了,今天换了新电脑,先安装前端神器“sublime” 一,安装 下载sublime,官方网址:http://www.sublimetext.com/: 二.插件包安装( Package Con ...
- 教你建立SQL数据库的表分区
1)新建一个数据库 2)添加几个文件组 3)回到“常规”选项卡,添加数据库文件 看到用红色框框起来的地方没?上一步中建立的文件组在这里就用上了.再看后面的路径,我把每一个文件都单独放在不同的磁盘上,而 ...
- PHP curl_multi_getcontent函数
curl_multi_getcontent — 如果设置了CURLOPT_RETURNTRANSFER,则返回获取的输出的文本流 说明 string curl_multi_getcontent ( r ...
- PCB下元器件重叠放置--Altium Designer
这里指的是同层元件重叠,即在大的器件下放置小的器件:虽然程序设计规则默认同层元件重叠是错误的,但是在实际设计中,同层元件重叠却经常使用. 以Altium Designer9.0为例:不过好像规则里并没 ...
- springboot下的多数据源切换
今天在考虑如果分公司也用系统了,怎么办,是单独的数据库,还是一起使用?所以就想到了切换数据源来实现,但是发现,只是读写分离,还要再改一下,根据用户地域来切换数据源,今天先照着例子做一下. 看了好多文章 ...
- 解决“element表单验证输入的数字检测出来是string”的问题
form表单: 校验规则: 注意:一.数字类型的验证需要在 v-model 处加上 .number 的修饰符,这是 Vue 自身提供的用于将绑定值转化为 number 类型的修饰符.二.校验中是否添加 ...
- python中的单例模式及其实现
单例模式(Singleton Pattern)是一种常用的软件设计模式,该模式的主要目的是确保某一个类只有一个实例存在. 当你希望在整个系统中,某个类只能出现一个实例时,单例对象就能派上用场. 比如, ...
- python练习题之随机生成验证码
#引用random模块下的randint项目#定义验证码函数.定义一个空字符串变量,分三种情况,随机产生的大写字母,随机产生的小写字母,随机产生的数字.然后#每一次执行哪一种情况,条件也是随机的,就是 ...
- 使用nsenter进入docker容器后端报错 mesg: ttyname failed: No such file or directory
通过nsenter 进入到docker容器的后端总是报下面的错,, [root@devdtt ~]# docker inspect -f {{.State.Pid}} mynginx411950 [r ...
- linux配置防火墙 Centos7下 添加 端口白名单
最近在阿里云服务器centos7上部署项目 要开启8484端口 , CentOS 7默认使用的是firewall作为防火墙 在firewall下开启端口白名单 1.查看下防火墙的状态:systemct ...