在看使用webpack打包的项目代码时,经常会看到在路径中引用@符号

import  one from '@/views/one.vue'

  

  那这里的@符号到底表示什么意思呢?

  这其实利用了webpack的  resolve.alias  特性,webpabk.config.js  的配制代码如下,在webpack打包时,会把路径引用中的@符号,转换为相对应的路径。

const path = require("path");
function resolve(dir) {
return path.join(__dirname, '..', dir);
} module.exports = {
resolve: {
extensions: ['*', '.js', '.vue'],
alias:{
'vue$': 'vue/dist/vue.common.js',
'@': resolve('src')  // 通过这里的配置,@符号等同于src
}
}
}

  

  

webpack打包文件中的@符号表示什么意思的更多相关文章

  1. 成功解决react+webpack打包文件过大的问题

    最近在学习并使用webpack+react+antd写了一个小项目,也可以说是demo,待全部开发完成后发现webpack的打包文件足足有将近13.3MB,快吓死宝宝了,经过连续几天的学习,和调试最后 ...

  2. 在xml文件中写入&符号时需要对其进行转义

    如:在xml文件中保存这样的测试文件: <?xml version="1.0" encoding="utf-8"?> <datas> & ...

  3. 如何降低Vue.js项目中Webpack打包文件的大小?

    https://blog.csdn.net/maray/article/details/50988500?utm_source=blogxgwz0 import Blur from ‘vux/src/ ...

  4. vue+webpack 打包文件 404 页面空白

    最近用vue-cli+vue-router+webpack建立项目,其中的遇到的三个问题,整理如下: vue-cli+ webpack 建立的项目,cnpm run build 打包项目之后,需要放在 ...

  5. 解决 webpack 打包文件体积过大

    webpack 把我们所有的文件都打包成一个 JS 文件,这样即使你是小项目,打包后的文件也会非常大.下面就来讲下如何从多个方面进行优化. 去除不必要的插件 刚开始用 webpack 的时候,开发环境 ...

  6. webpack打包文件解析

    /** * 对于没有代码分割的,webpack会打包生成main.js一个大的自执行函数 * 函数参数是一个对象,键值分别是路径和模块的函数 * 函数内部定义了一些方法,包括__webpack_req ...

  7. mybatis.xml文件中#与$符号的区别以及数学符号的处理

    1.#{}表示一个占位符号,通过#{}可以实现preparedStatement向占位符中设置值,自动进行java类型和jdbc类型转换,#{}可以有效防止sql注入. #{}可以接收简单类型值或po ...

  8. webpack打包文件

    npm init -y//生成package.json npm install webpack webpack-cli --save-dev//安装webpack和webpack-cli根据入口文件. ...

  9. webpack打包配置中出现的问题

    第一个错误: One CLI for webpack must be installed. These are recommended choices, delivered as separate p ...

随机推荐

  1. Draw.io--自认为最好用的流程图绘制软件

    draw.io 是一个强大简洁的在线的绘图网站,支持流程图,UML图,架构图,原型图等图标.支持Github,Google Drive, One drive等网盘同步,并且永久免费.如果觉得使用Web ...

  2. python--小游戏(循环+随机)

    1 import time 2 import random 3 4 player_victory = 0 5 enemy_victory = 0 6 a1 = True 7 while a1: 8 f ...

  3. python中getpass模块

    1 import getpass 2 name = input('请输入你的名字:') 3 passwd = getpass.getpass('请输入你的密码:') 4 print(name) 5 p ...

  4. 1、MyBatis框架底层初涉

    1.拜年 哈哈,现在是过年了,祝大家新年好. 本来大过年的是不打算碰电脑的,(抢票除外,三疯同学现在还没抢到票,然后突然又延长假期了).现在疫情严重,被堵家里不能出去了.不能为国家做贡献,但是起码不能 ...

  5. laravel 创建授权策略

    用户只能编辑自己的资料 在完成对未登录用户的限制之后,接下来我们要限制的是已登录用户的操作,当 id 为 1 的用户去尝试更新 id 为 2 的用户信息时,我们应该返回一个 403 禁止访问的异常.在 ...

  6. python数组冒号取值操作

    1.冒号的用法 1.1 一个冒号 a[i:j] 这里的i指起始位置,默认为0:j是终止位置,默认为len(a),在取出数组中的值时就会从数组下标i(包括)一直取到下标j(不包括j) 在一个冒号的情况下 ...

  7. L3-023 计算图

    建立结构体保存每个结点的前驱,操作符,来回两遍拓扑排序~ #include<bits/stdc++.h> using namespace std; ; struct node { vect ...

  8. Vue——手机号、验证码登录(设置按钮60s禁用倒计时)

    最近在做一个Vue项目,前端通过手机号.验证码登录,获取验证码按钮需要设置60s倒计时(点击一次后,一分钟内不得再次点击).先看一下效果图: 输入正确格式的手机号码后,“获取验证码”按钮方可点击:点击 ...

  9. Debian9安装Metasploit

    参考博文:https://www.jianshu.com/p/ea0629b9e367 0x0 添加Kali源 deb http://http.kali.org/kali kali-rolling m ...

  10. 吴裕雄--天生自然Numpy库学习笔记:NumPy Matplotlib

    Matplotlib 是 Python 的绘图库. 它可与 NumPy 一起使用,提供了一种有效的 MatLab 开源替代方案. 它也可以和图形工具包一起使用,如 PyQt 和 wxPython. W ...