一般我们的入口文件会引入一下公共的样式文件,比如这样

import './style'

但是这个样式文件并不会生效呀,因为你的写法不对鸭,你要把文件的后缀名也要写

import './style.css'

为什么会这样了,这是因为commonJS文件查找的形式,一般会先找JS,再找JSON,再找文件,文件里面的index.js,反正就是很复杂,具体的去看看源码吧!

如何解决这个问题,就是在webpack的配置文件中配置

  resolve: {
extensions: ['.js', '.json', '.css'] // 配置commonJS的查找范围
}

按照指定的文件类型进行查找,这样就可以正确的找到我们需要的文件啦!所以有些时候报错时出现文件找不到,可能是这个原因哦

你学会了吗?点个赞吧!

webpack配置模块的查找范围的更多相关文章

  1. webpack指定第三方模块的查找路径

    通常我们会使用一些地方模块在我们的项目中,比如bootstrap import 'bootstrap' 导入的bootstrap默认会查找当前目录的node_modules文件,但是如果这个文件没有, ...

  2. vue-cli中webpack配置详解

    vue-cli是构建vue单页应用的脚手架,命令行输入vue init <template-name> <project-name>从而自动生成的项目模板,比较常用的模板有we ...

  3. vue-cli脚手架中webpack配置基础文件详解

    一.前言 原文:https://segmentfault.com/a/1190000014804826 vue-cli是构建vue单页应用的脚手架,输入一串指定的命令行从而自动生成vue.js+wep ...

  4. vue-cli 脚手架中 webpack 配置基础文件详解

    一.前言 vue-cli是构建vue单页应用的脚手架,输入一串指定的命令行从而自动生成vue.js+wepack的项目模板.这其中webpack发挥了很大的作用,它使得我们的代码模块化,引入一些插件帮 ...

  5. webpack配置指南

    Webpack已经出来很久了,相关的文章也有很多,然而比较完整的例子却不是很多,让很多新手不知如何下脚,下脚了又遍地坑 说实话,官方文档是蛮乱的,而且有些还是错的错的..很多配置问题只有爬过坑才知道 ...

  6. Webpack配置示例和详细说明

    /* * 请使用最新版本nodejs * 默认配置,是按生产环境的要求设置,也就是使用 webpack -p 命令就可以生成正式上线版本. * 也可以使用 webpack -d -w 命令,生成用于开 ...

  7. vue-cli#2.0 webpack 配置分析

    目录结构: ├── README.md ├── build │ ├── build.js │ ├── check-versions.js │ ├── dev-client.js │ ├── dev-s ...

  8. webpack配置这一篇就够

    最近看了一篇好文,根据这个文章重新梳理了一遍webpack打包过程,以前的一些问题也都清楚了,在这里分享一下,同时自己也做了一些小的调整 原文链接:http://www.jianshu.com/p/4 ...

  9. 前端工程化(二)---webpack配置

    导航 前端工程化(一)---工程基础目录搭建 前端工程化(二)---webpack配置 前端工程化(三)---Vue的开发模式 前端工程化(四)---helloWord 继续上一遍的配置,本节主要记录 ...

随机推荐

  1. 【洛谷P1483】序列变换

    题目大意:给定一个长度为 N 的序列,有 M 个操作,支持将下标为 x 的倍数的数都加上 y,查询下标为 i 的元素的值. 题解:由于查询操作很少,相对的,修改操作很多.若直接模拟修改操作,即:枚举倍 ...

  2. 关于Nginx负载均衡的5种策略

    nginx的upstream目前支持的5种方式的分配 1.轮询(默认) 每个请求按时间顺序逐一分配到不同的后端服务器,如果后端服务器down掉,能自动剔除. upstream backserver { ...

  3. Python基础-元组、列表、字典

    元组tuple 元组被称为只读列表,即数据可以被查询,但不能被修改,所以,字符串的切片操作同样适用于元组.例:(1,2,3)("a","b","c&q ...

  4. Mac 软件专题之:OS X Yosemite 精彩应用软件推荐

    目前,很多软件都已经发布了针对Yosemite系统的版本,今天和大家分享专题:「OS X Yosemite 精彩应用」,主要分享适配Yosemite系统全新的扁平化界面和新功能的软件,但要知道未在此专 ...

  5. 使用Thumb

    目录 使用Thumb title: 使用Thumb tags: ARM date: 2018-10-24 19:28:32 --- 使用Thumb C文件使用编译选择增加 -mthumb即可,修改ma ...

  6. ATPCS规则

    title: ATPCS规则 tags: ARM date: 2018-10-14 17:03:23 --- ATPCS规则 ARM指令集E004armproc.chm ATPCS介绍与使用.pdf ...

  7. Hbase学习04

    3.2.4 反向时间戳 反向扫描API HBASE-4811(https://issues.apache.org/jira/browse/HBASE-4811)实现了一个API来扫描一个表或范围内的一 ...

  8. 【.NET】asp.net Redirect 图片路径

    #需求: 前端通过<img>的src向服务端请求图片信息,如果不存在想要的图片,那么就返回一张默认路径下的图片: #实现: <img class="related_reso ...

  9. JAVA核心技术I---JAVA基础知识(格式化相关类)

    一:格式化相关类 (一)java.text包java.text.Format的子类 –NumberFormat:数字格式化,抽象类 DecimalFormat –MessageFormat:字符串格式 ...

  10. Ubuntu 18.04 设置开机启动脚本 rc.local systemd

    ubuntu18.04不再使用initd管理系统,改用systemd. ubuntu-18.04不能像ubuntu14一样通过编辑rc.local来设置开机启动脚本,通过下列简单设置后,可以使rc.l ...