首先利用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. scala函数demo

    /** * Created by root * Description : 柯里化函数,偏应用函数,匿名函数,高阶函数 */ object FunctionTest { def main(args: ...

  2. Java的Integer和int有什么区别

    Java是面向对象的编程语言,一切都是对象,但是为了编程的方便还是引入了基本数据类型,为了能够将这些基本数据类型当成对象操作,Java为每一个基本数据类型都引入了对应的包装类型(wrapper cla ...

  3. IOS音频1:之采用四种方式播放音频文件（一）AudioToolbox AVFoundation OpenAL AUDIO QUEUE

    本文转载至 http://blog.csdn.net/u014011807/article/details/40187737 在本卷你可以学到什么? 采用四种方法设计应用于各种场合的音频播放器: 基于 ...

  4. jquery前端验证框架

    1.validationEngine.jquery.css  样式包 2.jquery.validationEngine-zh_CN.js 中文语言包 3.jquery.validationEngin ...

  5. Android学习之DatePicker和TimePicker

    在Android开发的应用程序中,通常都会有时间和日期选择的需求,下面就对日期选择控件DatePicker和时间选择控件TimePicker的基本使用方法进行介绍:        DatePicker ...

  6. RabbitMQ与java、Spring结合实例详细讲解

    林炳文Evankaka原创作品.转载请注明出处http://blog.csdn.net/evankaka 摘要:本文介绍了rabbitMq,提供了如何在Ubuntu下安装RabbitMQ 服务的方法. ...

  7. Linux设备驱动剖析之SPI（四）

    781行之前没什么好说的,直接看783行,将work投入到工作队列里,然后就返回,在这里就可以回答之前为什么是异步的问题.以后在某个合适的时间里CPU会执行这个work指定的函数,这里是s3c64xx ...

  8. css修改select默认样式

    先来看看效果图: css: <style media="screen"> .select_demo, .select_list { width: 400px; heig ...

  9. Linux SVN 服务器

    一. SVN 简介 Subversion(SVN) 是一个开源的版本控制系統, 也就是说 Subversion 管理着随时间改变的数据. 这些数据放置在一个中央资料档案库 (repository) 中 ...

  10. 学习生活必须知道的网站或者App

    转载自:https://www.douban.com/group/topic/89798480/ 学习方面: 1.网易公开课(http://v.163.com/special/test/alltest ...