写在最前:webpack的总结也是自己坑过,实践过但是也是针对性的使用,在加上webpack的背景,对于其‘原理’方面有很大的不正确的理解,有错误的地方,请尽情指出(乖巧~)

由于版本遇到的问题:

在配置loader的时候发现,总是报错,比如这种

Module not found: Error: Can't resolve 'style' in 'E:\another\webpcktest'
BREAKING CHANGE: It's no longer allowed to omit the '-loader' suffix when using loaders.
You need to specify 'style-loader' instead of 'style'.

或者这种,

Module parse failed: E:\another\webpcktest\controller\index.css Unexpected token (2:2)
You may need an appropriate loader to handle this file type.

或者这种

Module not found: Error: Can't resolve 'style' in 'E:\another\webpcktest'

或者这种

ERROR in Entry module not found: Error: Can't resolve './controller/index.js' in 'E:\another\webpcktest\dist'

我一直以为还需要一个什么加载器 或者要下载正确的加载器,采取了下面措施:

-----分别下了css-loader/////css ×

----添加reslove

这个是最贴近报错原因的 -->  http://www.tuicool.com/articles/U3ENRvA

resolve: {
root: path.resolve(__dirname, "src"),
// root: __dirname + '/src',
}

-----添加file-losder

导致报错原因穷出不出,忽略了webpack最原始的提示:在webpack2中,加载器的选择应该从style------>style-laoder,明明白纸黑字写的很清楚啊所以这个坑跳过啦。

       {test: /\.html$/, loader: 'raw'},
{test: /\.css$/, loader: 'style-loader!css-loader'},
{test: /\.scss$/, loader: 'style-loader!css-loader!sass-loader'},
{test: /\.(png|jpg|ttf)$/, loader: 'url?limit=8192'}

tips:

npm ls 查看安装的模块及依赖

npm ls -g 查看全局安装的模块及依赖

npm uninstall xxx  (-g) 卸载模块

npm cache clean 清理缓存

package.json文件的部分字段的含义如下:

name 项目名称(必须),是一个字符串

version 项目版本号(必须),是一个字符串

description 项目描述,是一个字符串

main 字段指定了加载该模块时的入门文件,默认是模块根目录下面的index.js,,是一个字符串

scripts 指定了运行脚本命令的npm命令行缩写,比如start指定了运行npm run start时,所要执行的命令,是一个对象

keywords npm包的关键字,是一个字符串的数组,如["node.js","javascript"]

author 作者个人信息,,是一个字符串

license 指定一个license来让用户知道他们的使用权利和和任何限制

dependencies 指定了项目运行所依赖的模块

devDependencies 指定项目开发所需要的模块

webpack2诸类事宜的更多相关文章

  1. java.util.concurrent并发包诸类概览

    java.util.concurrent包的类都来自于JSR-166:Concurrent Utilities,官方的描述叫做“The JSR proposes a set of medium-lev ...

  2. Java类的继承与多态特性-入门笔记

    相信对于继承和多态的概念性我就不在怎么解释啦!不管你是.Net还是Java面向对象编程都是比不缺少一堂课~~Net如此Java亦也有同样的思想成分包含其中. 继承,多态,封装是Java面向对象的3大特 ...

  3. Smart210学习记录------块设备

    转自:http://bbs.chinaunix.net/thread-2017377-1-1.html 本章的目的用尽可能最简单的方法写出一个能用的块设备驱动.所谓的能用,是指我们可以对这个驱动生成的 ...

  4. 【转】 从输入 URL 到页面加载完成的过程中都发生了什么事情?

    该问题总结 一. 往浏览器输入URL后给你一个页面,你天天在使用的东西,学过计算机网络的知道是怎么回事,就DNS解析然后页面的回馈,不过要讲好还是有难度. 之前fex团队的nwind专门写过这个问题的 ...

  5. C++内存管理学习笔记(2)

    /****************************************************************/ /*            学习是合作和分享式的! /* Auth ...

  6. 【陪你系列】5 千字长文+ 30 张图解 | 陪你手撕 STL 空间配置器源码

    大家好,我是小贺. 点赞再看,养成习惯 文章每周持续更新,可以微信搜索「herongwei」第一时间阅读和催更,本文 GitHub https://github.com/rongweihe/MoreT ...

  7. CSS基本知识点——带你走进CSS的新世界

    CSS基本知识点 我们在学习HTML之后,前端三件套第二件便是CSS,但CSS内容较多,我们分几部分讲解: (如果没有学习HTML,请参考之前文章:HTML知识点概括--一篇文章带你完全掌握HTML& ...

  8. 打造强势智能手表平台:Testin云測携手索尼招募全球开发人员

    打造强势智能手表平台:Testin云測携手索尼招募全球开发人员 2014/10/27 · Testin · 业界资讯 日前,全球最大的移动游戏.应用真机和用户云測试平台Testin云測宣布联手索尼公司 ...

  9. 【转】Java方向如何准备BAT技术面试答案(汇总版)

    原文地址:http://www.jianshu.com/p/1f1d3193d9e3 这个主题的内容之前分三个篇幅分享过,导致网络上传播的比较分散,所以本篇做了一个汇总,同时对部分内容及答案做了修改, ...

随机推荐

  1. java %d %n \n

    Java中,%d和%f分别用来表示输出时,替换整型输出和浮点型输出的占位符. 如: int a=28; float b = 13.0f; System.out.printf("整数是:%d% ...

  2. WPF常规表单验证

    1:ViewModel 实现验证接口 IDataErrorInfo 2:实现接口的相关验证逻辑,并把错误信息反馈给 Error public string this[string columnName ...

  3. Java web后台插入数据库中文乱码问题解决

    前言:项目想要避免乱码情况的出现,要保持服务器.数据库.项目.以及前端编码一致.一.项目以及前端编码,设置. myeclipse--->右键项目--->Properties--->R ...

  4. [已解决]报错:xlrd.compdoc.CompDocError: Workbook: size exceeds expected 17920 bytes; corrupt?

    报错代码如下: filePath='test.xls' data=pd.read_excel(filePath) print(data.head()) 报错内容如下: Traceback (most ...

  5. fixture实战---通过fixure,解决方法依赖逻辑

    import pytest@pytest.fixture()def login(): print('输入用户名密码登陆') def test_cart(login): print('用例1,登陆后执行 ...

  6. KiCAD绘制电源符号

    KiCAD绘制电源符号 KiCAD自带的电源符号有时候不符合我们的操作习惯,需要自己重新定义电源符号,这时候就需要新建(不能更改系统自带库的电源符号) 1.新建符号,参照下图行设置 2.放置引脚和图形 ...

  7. Codeforces 1150D DP

    题意:给你一个长度为n的字符串,有q次询问,每次询问会给字符串x的末尾添加一个字符y,或者删除字符串x末尾的字符,询问过后,要判断长度为n的字符串中是否有3个不重合的子序列,是这3个字符串. 思路:设 ...

  8. JavaScript 中 reduce去重方法

    过去有很长一段时间,我一直很难理解 reduce() 这个方法的具体用法,平时也很少用到它.事实上,如果你能真正了解它的话,其实在很多地方我们都可以用得上,那么今天我们就来简单聊聊 JS 中 redu ...

  9. 58. jdk1.5新特性之静态导入

    jdk1.5新特性之--------静态导入 作用:简化书写(在我们使用静态方法的时候要用  类名.方法名的方式调用.而用静态导入只需要写方法名就可以调用) 语法:    1.作用于一个方法:     ...

  10. 自定义checkbox,radio样式

    input[type=radio] { margin-right: 5px; cursor: pointer; font-size: 14px; width: 15px; height: 15px; ...