首先利用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. 【Python】paddlepaddle docker python2.7 centos运行

    PS E:\AI\BlockMining> docker cp .\LearnPaddle-master\ 30acd98dbc60:\rootPS E:\AI\BlockMining> ...

  2. 如何编写一个SQL注入工具

    0x01  前言 一直在思考如何编写一个自动化注入工具,这款工具不用太复杂,但是可以用最简单.最直接的方式来获取数据库信息,根据自定义构造的payload来绕过防护,这样子就可以. 0x02 SQL注 ...

  3. Redis 操作列表数据

    Redis 操作列表数据: > lpush list1 "aaa" // lpush 用于追加列表元素,默认追加到列表的最左侧(left) (integer) > lp ...

  4. Linux init 命令

    init命令用于切换到指定的运行级别,用法如下: [root@localhost ~]# init //关机 [root@localhost ~]# init //切换到单用户模式/救援模式 [roo ...

  5. [XPath] XPath 与 lxml (一)XPath 术语

    前言 这是一篇主要介绍 XPath 的文章,由于 JQuery 已经不支持 XPath,所以本文主要通过 Python 的 lxml.etree 来介绍 XPath. 什么是 XPath ? XPat ...

  6. 小北微信小程序之小白教程系列之 -- 样式(WXSS)

    为了适应广大的前端开发者,WXSS 具有 CSS 大部分 特性.同时为了更适合开发微信小程序,WXSS 对 CSS 进行了扩充以及修改.与 CSS 相比,WXSS 扩展的特性有:尺寸单位和样式导入. ...

  7. 《转》Python学习(17)-python函数基础部分

    http://www.cnblogs.com/BeginMan/p/3171977.html 一.什么是函数.方法.过程 推荐阅读:http://www.cnblogs.com/snandy/arch ...

  8. 【llinux】yum命令出现Loaded plugins: fastestmirror Determining fastest mirrors

    在进行yum 安装的时候.报错了. Loaded plugins: fastestmirror Determining fastest mirrors fastestmirror是yum的一个加速插件 ...

  9. vuex - 常用命令学习及用法整理

    https://vuex.vuejs.org/zh-cn/api.html 命令 用途 备注 this.$store 组件中访问store实例 store.state.a 获取在state对象中的数据 ...

  10. 法律&道德

    西弗森是美国加州一名95岁的老妇人,2010年12月份的一天,她在家清理房间,当她翻开一叠纸的时候,一本书从里面掉了下来,她弯腰拾起来,发现是一本名叫<水上飞机独自飞>的书,再一看书页里的 ...