webpack 3.8 使用 extract-text-webpack-plugin 3.0 抽取css失败:You may need an appropriate loader to handle this file type.
webpack 3.8.1 使用 extract-text-webpack-plugin 3.0.2 抽取css时失败,报错: ERROR in ./src/static/style/localTime.css
Module parse failed: Unexpected token (1:0)
You may need an appropriate loader to handle this file type.
| .localTimeBox {
| color: red;
| }
@ ./node_modules/style-loader!./src/static/style/localTime.css 4:14-42 webpack-build.config.js 配置为:
module: {
loaders: [
{
test: /\.css$/,
loader: ExtractTextPlugin.extract('style-loader', 'style-loader!css-loader', {publicPath: '../'})
}
]
},
plugins: [
new ExtractTextPlugin('css/bundle.min.css', {allChunks: true}),
]
解决方法:
将webpack-build.config.js 配置改为:
module: {
loaders: [
{
test: /\.css$/,
loader: ExtractTextPlugin.extract({
fallback: 'style-loader',
use: ['css-loader'],
publicPath: '../'
})
}
]
},
plugins: [
new ExtractTextPlugin('css/bundle.min.css', {allChunks: true}),
]
问题就解决了。具体原因好像是版本的写法问题。
webpack 3.8 使用 extract-text-webpack-plugin 3.0 抽取css失败:You may need an appropriate loader to handle this file type.的更多相关文章
- webpack从零开始第1课:安装webpack和webpack-dev-server
原文地址:https://segmentfault.com/a/1190000012536871 webpack目录 第1课: 安装webpack和webpack-dev-server 第2课: 配置 ...
- Webpack实战(六):如何优雅地运用样式CSS预处理
上一篇文章中,我主要分享了<Webpack如何分离样式文件>CSS 预处理器是一个能让你通过预处理器自己独有的语法来生成CSS的程序,css预处理指的是在开发中我们经常会使用一些样式预编译 ...
- webpack dev server 和 sublime text 配合时需要注意的地方
参考:https://webpack.js.org/guides/development/ Adjusting Your Text Editor Some text editors have a &q ...
- 阅读webpack代码笔记:antd-layout的webpack.config.prod.js
'use strict'; const autoprefixer = require('autoprefixer');//自动补全css前缀 const path = require('path'); ...
- webpack入门和实战(一):webpack配置及技巧
一.全面理解webpack 1.什么是 webpack? webpack是近期最火的一款模块加载器兼打包工具,它能把各种资源,例如JS(含JSX).coffee.样式(含less/sass).图片等都 ...
- 【Webpack的使用指南 02】Webpack的常用解决方案
说是解决方案实际上更像是webpack的插件索引. 写这一篇的目的是为了形成一个所以,将来要用时直接来查找即可. 索引目录 1.自动构建HTML,可压缩空格,可给引用的js加版本号或随机数:html- ...
- Webpack + Vue 多页面项目升级 Webpack 4 以及打包优化
0. 前言 早在 2016 年我就发布过一篇关于在多页面下使用 Webpack + Vue 的配置的文章,当时也是我在做自己一个个人项目时遇到的配置问题,想到别人也可能遇到跟我同样的问题,就把配置的思 ...
- webpack 快速入门 系列 —— 初步认识 webpack
初步认识 webpack webpack 是一种构建工具 webpack 是构建工具中的一种. 所谓构建,就是将资源转成浏览器可以识别的.比如我们用 less.es6 写代码,浏览器不能识别 less ...
- [js高手之路]深入浅出webpack教程系列3-配置文件webpack.config.js详解(下)
本文继续接着上文,继续写下webpack.config.js的其他配置用法. 一.把两个文件打包成一个,entry怎么配置? 在上文中的webpack.dev.config.js中,用数组配置entr ...
随机推荐
- JavaSE 第二次学习随笔(二)
循环结构中的多层嵌套跳出 targeta: for(int i = 0; i < 100; i++){ for (int j = 0; j < 100; j++) { if(i + j = ...
- 我的机器学习之路--anaconda环境搭载
网上许多教程比较晦涩难懂,本教程按照笔者(新手)自己的视角记录,希望给大家一些帮助 1.安装anaconda 目前比较推荐的机器学习环境为anaconda. Anaconda指的是一个开源的Pytho ...
- 初识python 文件读取 保存
上一章最后一题的答案:infors.sort(key=lambda x:x['age'])print(infors)--->[{'name': 'laowang', 'age': 23}, {' ...
- PHP教程专题资源免费下载地址收藏
PHP教程专题资源免费下载地址收藏 PHP,即Hypertext Preprocessor,是一种被广泛应用的开源通用脚本语言,尤其适用于 Web 开发并可嵌入 HTML 中去.它的语法利用了 C. ...
- python2.7练习小例子(二十二)
22):题目:有一分数序列:2/1,3/2,5/3,8/5,13/8,21/13...求出这个数列的前20项之和. 程序分析:请抓住分子与分母的变化规律. #!/usr/bin/pyt ...
- 异步消息处理(Message, Handler, MessageQueue, Looper)
AsyncTask 适用于单线程任务处理,多任务处理还是 Message/Handler 处理方便一些 主要使用方式: 1,创建子类继承自 Handler 类,覆盖 handleMessage(Mes ...
- 将List中的数据更新到数据库中
List中有相应的数据,更新到数据库如下: 1.根据关键字查找后删除: foreach (var item in objSelList) { ADDaAn da = db.ADDaAns.Find(i ...
- html5学得好不好,看掌握多少标签
html5学得好不好,看掌握多少标签 已回复 会员ID:wi701329 保密 62岁 时间:2016-06-28 06:52:49 html5你了解了多少?如果你还是入门阶段的话,或者还是一知半解的 ...
- 关于C#数据类型自己的理解
电脑CUP处理程序的运行.cpu里分为一级缓存,二级缓存,还有三级缓存,之后是内存里的东西. 栈存放在一级缓存里,所以cup调用速度最快,处理起来也效率也最高,但是大小很小,能存放的东西很少. 堆存放 ...
- vi/vim 命令使用详解
1.Linux下创建文件 vi test.txt 或者 vim test.txt 或者 touch test.txt 2.vi/vim 使用 基本上 vi/vim 共分为三种模式,分别是命令模式(Co ...