1. 配置文件目录:

build>webpack.base.config.js:
resolve: {
  alias: {
    '@': resolve('src'),
    'styles': resolve('src/asset/styles')
  }
}

2. 于是一些长路径,如:

import '../../../../../../../styles/iconfont.css'  --> import 'styles/iconfont.css'
import '~@/assets/styels/header.css' --> import '~styles/header.css'

3. 修改配置文件,不会热更新,所以重启项目,免得老报错

webpack给目录起别名的更多相关文章

  1. webpack + ts 配置路径别名无死角方法总结

    webpack + ts 配置路径别名总结 自我体验加总结:在配置脚手架时,定制别名很有必要,可以使得代码更优雅,可读性更强.但在使用ts的时候,即便项目能够运行,vscode 确时长会提示 can' ...

  2. webpack之给目录起别名

    1. 配置文件目录: build>webpack.base.config.js: resolve: { alias: { '@': resolve('src'), //照猫画虎 'styles' ...

  3. 模板为webpack的目录结构

    目录结构 | -- build // 项目构建(webpack)相关代码 | |-- build.js // 生产环境构建代码 | |-- check-version.js // 检查node.npm ...

  4. Webpack, VSCode 和 Babel 组件模块导入别名

    很多时候我们使用别人的库,都是通过 npm install,再简单的引入,就可以使用了.     1 2 import React from 'react' import { connect } fr ...

  5. webpack run dev后并没有生成dist目录,但是浏览器里却读取了dist里的build.js?

    最近想看看现在做的React项目用的脚手架,看了下webpack的配置,尝试修改一些东西看看输出结果,结果允许npm run dev发现没有输出目录,怎么回事呢.又安装了vue官方提供的webpack ...

  6. 30分钟手把手教你学webpack实战

    30分钟手把手教你学webpack实战 阅读目录 一:什么是webpack? 他有什么优点? 二:如何安装和配置 三:理解webpack加载器 四:理解less-loader加载器的使用 五:理解ba ...

  7. webpack入门和实战(一):webpack配置及技巧

    一.全面理解webpack 1.什么是 webpack? webpack是近期最火的一款模块加载器兼打包工具,它能把各种资源,例如JS(含JSX).coffee.样式(含less/sass).图片等都 ...

  8. webpack实战

    webpack实战 30分钟手把手教你学webpack实战 2015-09-08 23:02 by 龙恩0707, 175 阅读, 0 评论, 收藏, 编辑 30分钟手把手教你学webpack实战 阅 ...

  9. 优化Webpack构建性能的几点建议

    Webpack 作为目前最流行的前端构建工具之一,在 vue/react 等 Framework 的生态圈中都占据重要地位.在开发现代 Web 应用的过程中,Webpack 和我们的开发过程和发布过程 ...

随机推荐

  1. php实现算法

    二分法查找(已排序) @params  $arr 查找的数组  $start 开始查找的下标  $end 结束查找的下标  $value 查找的值 function bin_search($arr,$ ...

  2. python 基础例子 双色球 查询天气 查询电话

    # 随机生成双色球import random# 随机数 1-16之间# r = random.randint(1,16)# print(r)phone_numbers_str = "匪警[1 ...

  3. 一文看懂java io系统 (转)

    出处:  一文看懂java io系统   学习java IO系统,重点是学会IO模型,了解了各种IO模型之后就可以更好的理解java IO Java IO 是一套Java用来读写数据(输入和输出)的A ...

  4. S02_CH13_ AXI_PWM 实验

    S02_CH13_ AXI_PWM 实验 当学习了上一章的协议介绍内容后,开发基于这些协议的方案已经不是什么难事了,关键的一点就是从零到有的突破了.本章就以AXI-Lite总线实现8路LED自定义IP ...

  5. docker-registry的定制和性能分析

    docker-index Web UI Meta-data 元数据存储(附注.星级.公共库清单) 访问认证 token管理 存储镜像.以及镜像层的家族谱系 没有用户账户数据 不知道用户的账户和安全性 ...

  6. bzoj 2734 集合悬殊 (状压dp)

    大意: 给定$n$, 求集合{1,2,...n}的子集数, 满足若$x$在子集内, 则$2x,3x$不在子集内. 记$f(x)$为$x$除去所有因子2,3后的数, 那么对于所有$f$值相同的数可以划分 ...

  7. Wannafly挑战赛23

    B. 游戏 大意: $n$堆石子, 第$i$堆初始$a_i$, 每次只能选一堆, 假设一堆个数$x$, 只能取$x$的约数, 求先手第一步必胜取法. SG入门题, 预处理出所有$SG$值. 先手要必胜 ...

  8. WP8的新功能-通过一个程序来启动另一个程序

    Wp8对原来的WP7做了大量的优化...其中一个就包括Protocol Association,也就是通过uri来打开另外一个程序,这也就是说,我们可以做一个程序来启动另外一个程序了,如微信,QQ之类 ...

  9. javaIO——StringReader & StringWriter

    上一篇概述篇说过,一个IO对象是指一个可以被关闭的数据源或者目标,那么StringReader和StringWriter就是一个字符串源和字符串目标. 1. StringtReader: 文档说:St ...

  10. SpringBoot与缓存、消息、检索、任务、安全与监控

    一.Spring抽象缓存 Spring从3.1开始定义了org.springframework.cache.Cache和org.springframework.cache.CacheManager接口 ...