首先利用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. debug的一点总结

    程序员常常需要和bug打交道,一般来说调试bug的时间要多于编写程序的时间. bug可以简单的分为两大类: 语法上的bug 逻辑上的bug 语法上的bug就是指编译器能够识别的,例如常见的缺少分号和括 ...

  2. 【代码审计】iZhanCMS_v2.1 前台存储型XSS漏洞分析

      0x00 环境准备 iZhanCMS官网:http://www.izhancms.com 网站源码版本:爱站CMS(zend6.0) V2.1 程序源码下载:http://www.izhancms ...

  3. Kubernetes 简介

    一.Kubernetes 相关概念 1. Kubernetes 是一个开源的容器集群管理系统,主要用来自动化部署容器 .自动扩展与收缩容器规模 .提供容器间的负载均衡2. Node:Node(节点)也 ...

  4. Illegal mix of collations for operation 'concat'

    在t_employee表中,练习使用concat函数连接字符串时, mysql> select concat('工号为:',fnumber,'的员工的幸福指数:',fsalary/(fage-2 ...

  5. Delphi 10 Seattle 小票打印控件TQ_Printer

    TQ_Printrer控件,是一个为方便需要控制打印命令而设计的跨平台专用控件,已包含标准ESC/POS打印控制的基本指令在内(这些基本指令已能很好的满足多数项目使用). TQ_Printrer控件让 ...

  6. jQuery Sizzle选择器（二）

    自己开始尝试读Sizzle源码.   1.Sizzle同过自执行函数的方式为自己创建了一个独立的作用域,它可以不依赖于jQuery的大环境而独立存在.因此它可以被应用到其它js库中.实现如下:(fun ...

  7. 题目1005：Graduate Admission(录取算法)

    题目链接:http://ac.jobdu.com/problem.php?pid=1005 详解链接:https://github.com/zpfbuaa/JobduInCPlusPlus 参考代码: ...

  8. v-bind小demo

    啊哈哈,小颖好久没有更新博客啦,大家有没有想我呀,嘻嘻,自恋一把,

  9. nginx 日志文件

    默认日志格式 log_format access '$remote_addr - $remote_user [$time_local] "$request" ' '$status ...

  10. 【题目】求n以内的素数个数

    最近在leetCode上刷提,还是满锻炼人的,为以后面试打基础吧.不多说下面开始. 问题:求[2,n]之间的素数的个数. 来源:leetCode OJ 提示: Let's start with a i ...