webpack2.0 css文件引入错误解决及图片输出在根目录配置问题
webpack引入css文件,main.js内容如下
import Vue from 'vue';
import App from './App.vue'; import Mint from 'mint-ui';
import 'mint-ui/lib/style.css';
Vue.use(Mint);
webpack文件的配置如下:

之后就是各种报错信息,比较多见的是找不到对应的loader:

解决方案:
webpack中css-文件加载:
{
test: /\.css$/,
loader: 'style-loader!css-loader'
}
ok,解决问题,包括类似的,原因是。。。版本迭代
注意顺序,有的同学会写成 loader: 'css'或者 loader: 'css!style',或者不写'-loader'都会有报不同的错误。。。
还有解决build.js和图片输出在同一个根目录下面的问题:
{
test: /\.(png|jpg|gif|svg)$/,
loader: 'file-loader',
options: {
name: 'img/[name].[ext]?[hash]'
}
}
给一个我的demo的链接:https://github.com/BugsMaster/test.git
webpack2.0 css文件引入错误解决及图片输出在根目录配置问题的更多相关文章
- Oracle 11g R2(11.2.0.4) RAC 数据文件路径错误解决--ORA-01157 ORA-01110: 数据文件
Oracle 11g R2(11.2.0.1) RAC 数据文件路径错误解决--ORA-01157 ORA-01110: 数据文件 oracle 11g R2(11.2.0.4) rac--scan ...
- Linux 出现telnet: 127.0.0.1: Connection refused错误解决办法
Linux 出现telnet: connect to address 127.0.0.1: Connection refused错误解决办法 没有xinetd服务: 1./etc/init.d目录中放 ...
- 安卓安装提示:Android SDK requires Android Developer Toolkit version 21.1.0 or above. (错误解决方法)
安卓安装提示:Android SDK requires Android Developer Toolkit version 21.1.0 or above. (错误解决方法) 主要是因为版本号不正确 ...
- CSS 文件引入
CSS 文件引入 <html> <head> <!-- link标签引用其他文件.rel="stylesheet" 引用css.href=" ...
- MySQL 8.0安装以及初始化错误解决方法
MySQL 8.0 安装配置及错误排查 官网下载 CentOS7环境下的具体安装步骤 初始化MySQL发生错误的解决方法 忘记数据库root密码 官网下载 mysql官网下载链接:https://de ...
- VC++6.0打开文件出错的解决办法
1.下载http://support.microsoft.com/kb/241396里面的一个叫FileTool.exe的文件并解压,解压后是一个vc工程,用vc6.0打开工程,编译,得到FileTo ...
- CSS文件引入link和@import 区别
1.(本质区别)link 属于 HTML 标签,而 @import 完全是 css 提供的一种导入 css 文件的规则. 2.文件加载时机有差别: 当一个页面被加载的时候,link 引用的 css 会 ...
- Ubuntu16.04编译Android6.0/cm13.0教程及相关错误解决办法
一.必备工作 1.安装依赖库 sudo apt--dev libesd0-dev git-core gnupg flex bison gperf build-essential zip curl zl ...
- webpack 4.0 配置方法以及错误解决
选取一个空目录来试验 全局安装webpack4.1之后 创建目录 mkdir webpacktest && cd webpacktes 初始化package.json npm init ...
随机推荐
- Elasticsearch修改network后启动失败
修改 /config/elasticsearch.yml(我的安装目录是:/var/www/elasticsearch-6.4.2/elasticsearch-6.4.2), network.host ...
- keil常用配置设置
1.设置tab键为空格4个进入Configuration->Editor,设置如下: 2.代码自动补齐进入Configuration->Editor,设置如下: 3.使用快捷键实现批量注释 ...
- Spring Boot 整合 elk
一.elk 简介 Elasticsearch是个开源分布式搜索引擎,它的特点有:分布式,零配置,自动发现,索引自动分片,索引副本机制,restful风格接口,多数据源,自动搜索负载等. Logstas ...
- ASP.NET SignalR介绍
是什么? 简单来说,ASP.NET SignalR是一个开源的实时通讯(real-time)库,有了ASP.NET SignalR,我们可以在 详细介绍参考:https://docs.microsof ...
- vue2.5.2版本 :MAC设置应用在127.0.0.1:80端口访问; 并将127.0.0.1指向www.yours.com ;问题“ Invalid Host header”
0.设置自己的host文件,将127.0.0.1指向自己想要访问的域名 127.0.0.1 www.yours.com 1.MAC设置应用在127.0.0.1:80端口访问: config/index ...
- Vue利用canvas实现移动端手写板
<template> <div class="hello"> <!--touchstart,touchmove,touchend,touchcance ...
- SAP QA32 做使用决策系统报错:分类数据的不一致性=>交易终止
SAP QA32 做使用决策系统报错:分类数据的不一致性=>交易终止 QA32,对如下检验批做处理,系统报错, 试图使用MSC3N去显示这个批次主数据,同样报错, 原因在于批次的分类数据产生后, ...
- 从零学习Fluter(五):Flutter中手势滑动拖动已经网络请求
从六号开始搞Flutter,到今天写这篇blog已经过了4天时间,文档初步浏览了一遍,写下了这个demo.demo源码分享在github上,现在对flutter有种说不出的喜欢了.大家一起搞吧! 废话 ...
- Docker Data Center系列(二)- UCP安装指南
本系列文章演示如何搭建一个mini的云平台和DevOps实践环境. 基于这套实践环境,可以部署微服务架构的应用栈,演练提升DevOps实践能力. 1 系统要求 1.1 硬件和软件要求 Linux内核版 ...
- Ubuntu下crontab启动、重启、关闭命令
在Ubuntu14.04环境下,利用crontab编写shell脚本程序,定时执行php相关程序.在这个过程中,经常使用到的crontab命令如下: (root权限下) crontab启动:/etc/ ...