首先利用npm install webpack -g，这里我试过用cnpm安装不成功，不知道是什么回事，

webpack 用来压缩打包网站的一些插件和依赖包而存在的，

webpack  文件名  打包后的文件名

上图中，红框：哈希值（个人认为是不同文件的一个id，代表文件的唯一性【值得一提的是当文件作出修改后哈希值会发生变化，即在打包的文件中增加或者修改文件内容会发生变化】）黄框：webpack的版本号

在webpack里面需要插入更多的loader才能打包css文件：css-loader 、stytle-loader

打包html文件：html-webpack-plugin

webpack初入门的更多相关文章

  1. js学习笔记：webpack基础入门（一）

    之前听说过webpack,今天想正式的接触一下,先跟着webpack的官方用户指南走: 在这里有: 如何安装webpack 如何使用webpack 如何使用loader 如何使用webpack的开发者 ...

  2. webpack入坑之旅（三）webpack.config入门

    这是一系列文章,此系列所有的练习都存在了我的github仓库中vue-webpack,在本人有了新的理解与认识之后,会对文章有不定时的更正与更新.下面是目前完成的列表: webpack入坑之旅(一)不 ...

  3. webpack快速入门——实战技巧：watch的正确使用方法，webpack自动打包

    随着项目大了,后端与前端联调,我们不需要每一次都去打包,这样特别麻烦,我们希望的场景是,每次按保存键,webpack自动为我们打包,这个工具就是watch! 因为watch是webpack自带的插件, ...

  4. webpack快速入门——CSS进阶：自动处理CSS3前缀

    为了浏览器的兼容性,有时候我们必须加入-webkit,-ms,-o,-moz这些前缀.目的就是让我们写的页面在每个浏览器中都可以顺利运行. 1.安装 cnpm i postcss-loader aut ...

  5. webpack快速入门——如何安装webpack及注意事项

    1.window+R键,输入cmd打开命令行工具,输入 mkdir XXXX(XX:文件夹名): 2.cd XXX 进入刚刚创建好的文件夹里,输入cnpm install -g webpack (安装 ...

  6. webpack快速入门——webpack3.X 快速上手一个Demo

    1.进入根目录,建两个文件夹,分别为src和dist 1).src文件夹:用来存放我们编写的javascript代码,可以简单的理解为用JavaScript编写的模块. 2).dist文件夹:用来存放 ...

  7. webpack快速入门——配置文件：入口和出口，多入口、多出口配置

    1.在根目录新建一个webpack.config.js文件,然后开始配置: const path = require('path'); module.exports={ //入口文件的配置项 entr ...

  8. webpack快速入门——配置文件：服务和热更新

    1.在终端安装 cnpm i webpack-dev-server --save-dev 2.配置好后执行 webpack-dev-server,这时候会报错 出现错误,只需要在pagejson里配置 ...

  9. webpack快速入门——CSS文件打包

    1.在src下新建css文件,在css文件下新建index.css文件,输入以下代码 body{ background:pink; color:yellowgreen; } 2.css建立好后,需要引 ...

随机推荐

  1. CentOS安装、配置RabbitMQ

    安装步骤(rpm包安装): rpm安装官网:http://www.rabbitmq.com/install-rpm.html 下载rpm并安装: CentOs: wget http://www.rab ...

  2. 【应用安全】微软的安全开发生命周期(SDL)

    0x01 SDL介绍 安全开发生命周期(SDL)即Security Development Lifecycle,是一个帮助开发人员构建更安全的软件和解决安全合规要求的同时降低开发成本的软件开发过程. ...

  3. 如何关闭Struts2的webconsole.html

    出于安全目的,在禁用了devMode之后,仍然不希望其他人员看到webconsole.html页面,则可以直接删除webconsole.html 的源文件, 它的位置存在于: 我们手工删除 strut ...

  4. Mac上zip,rar,tar文件命令解压和压缩

    经常遇到在windowns上的压缩文件,在mac上解压出现问题,特意总结了下在Terminal里常用命令的方式解压和压缩文件 1.zip压缩文件 zip命令的参数很多,可以利用"zip -- ...

  5. MD5加密与base64编码

    转自:http://blog.csdn.net/sxzlc/article/details/74127268 import java.io.UnsupportedEncodingException; ...

  6. 配置React Native环境及解决运行异常

    一. 安装Homebrew: Homebrew的官网(多语言版本)简单明了地介绍了如何安装和使用这个工具,;并提供了自己的Wiki. brew的安装很简单,使用一条ruby命令即可,Mac系统上已经默 ...

  7. Objective-c官方文档 怎么使用对象

    版权声明:原创作品,谢绝转载!否则将追究法律责任.   对象发送和接受消息 尽管有不同的方法来发送消息在对象之间,到目前位置是想中括号那样[obj doSomeThing]:左边是接受消息的接收器,右 ...

  8. Windows平台下PHP7添加Sqlserver扩展

    1.7.0.x 7.0.x的扩展下载地址: Microsoft Drivers for PHP for SQL Server  https://www.microsoft.com/en-us/down ...

  9. linux下 php 安装mysql的扩展模块

    1.安装mysql-devel包 [root@DBproxy ~]# yum install mysql-devel 注:该包必须在编译php之前安装好,否则在安装php的mysql扩展模块是会碰到各 ...

  10. sencha touch + Cordova 3.x下载文件

    今天实现了一个文件下载功能,在网上找了下资料发现有些问题. 我用的是小米1s,安卓 4.1.2,cordova 3.5,打包测试运行正常 首先在控制层launch方法中加入以下代码: // 等待加载P ...