js中import 和require 出现@ 是什么意思

最新推荐文章于 2024-08-01 15:33:14 发布
最新推荐文章于 2024-08-01 15:33:14 发布
阅读量4.1k 收藏 6
点赞数 1
分类专栏： vue 文章标签： vue
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_41402809/article/details/115403891
版权
Webpack的Resolve.alias配置允许开发者创建模块导入的别名，例如将`import Button from '@/components/button'`映射为`import Button from './src/components/button'`，简化和优化项目中的导入路径。这一功能有助于提高代码的可读性和维护性，减少相对路径的使用。
摘要由CSDN通过智能技术生成

含义

在这里插入图片描述
在这里插入图片描述

表示指定路径名，可以由webpack配置

如何配置

可以在webpack resolve 中配置
在这里插入图片描述

Resolve配置webpack如何寻找模块对应的文件。webpack内置JavaScript模块化语法解析功能，默认会采用模块化标准里约定好的规则去寻找，但你可以根据自己的需要修改默认的规则。

resolve.alias配置项通过别名来把原来导入路径映射成一个新的导入路径。

 
 

配置之后

import Button from '@/components/button'导入时，实际上被alias等价替换成import Button from './src/components/button'。

海绵泡泡
关注
专栏目录
JavaScript中使用import 和require打包后实现原理分析
10-18
为了说明如何使用webpack打包import和require的代码，我们可以在命令行中使用webpack命令，并指定入口文件（如main.js），最终生成bundle.js文件。bundle.js就是webpack处理后的结果，它包含了整个应用的运行逻辑。 ...
详解Node中导入模块require和import的区别
08-29
Node.js 中导入模块 require 和 import 的区别 Node.js 中的模块化编程是基于 CommonJS 规范的，而在 ES6 中，则是基于 ES6 模块标准的。在 Node.js 中，我们使用 require 函数来导入模块，而在 ES6 中，我们使用 ...
【JS】import 、import() 与 @import 的区别
小安驾到的博客
02-17 1853
import xx from '...' 是一种导入方式，是es6模块化的新语法，必须要写到js文件的最上面；
JavaScript import/export
gnimgnot
11-17 3514
定义模块ES6之后，使用模块语法（import/export）时，每个文件都会成为它自己的模块，带有一个私有全名空间。顶层的函数和变量不会污染全局全名空间。要为其他模块暴露函数，类，和变量以便import的话，可以用export关键字。// not exported function somethingPrivate() { console.log('TOP SECRET') } expor
JavaScript中的import from语法：用法、示例与注意事项
最新发布
软考鸭
08-01 1084
JavaScript中的语法是ES6（ECMAScript 2015）引入的一个重要特性，它允许开发者从其他模块中导入功能（如变量、函数、类等），从而提高了代码的可读性、可维护性和复用性。以下是对。
vuejs webpack模板里import路径中@符号是什么意思以及不能自动刷新解决方法
热门推荐
有问题可关注公众号：前端研究院 后台输入问题回复
04-25 1万+
问：用vuejs的webpack模板生成的项目中，router/index.js里面有一句：import Hello from '@/components/Hello'这里路径前面的“@”符号表示什么意思？回答没事儿就去看看vue模板的代码，里面都有，这是webpack的路径别名，相关定义在这里：resolve: { // 自动补全的扩展名 extensions: ['.js', ...
一篇文章弄懂 JavaScript 中的 import
weixin_34149796的博客
12-07 823
import 语句用于导入由另一个模块导出的绑定。无论是否声明了 strict mode，导入的模块都运行在严格模式下。import语句不能在嵌入式脚本中使用。 语法 import defaultExport from “module-name”; import * as name from “module-name”; import { export } from “module-name”; ...
node.js及npm、vue等js类框架中@的用法
細水、長流√的专栏
09-10 1117
首先，“@”是一个符号，电子信箱中意义为“at”，即“某用户”在“某服务器”。好了，关于在前端nodejs中相关项目中经常出现的@符号就总结到此，还有哪些小编不知道的用法，还请博友在下面留言补充，以完善知识，利于学习之用。二、在npm中，与“/”相结合，置于包的名字前，表示该包的范围，即指示该包属于某个用户或组织，是该用户或组织提供的私有或公有包。三、node.js中，符合ES6标准的import命令中出现的@， 如。四、Vue的元素标签中，@”是指令“v-on”的缩写。
Javascript(es2016) import和require用法和区别详解
10-19
在ES2016中，主要使用import和require两种方式来实现模块的导入和导出，这两者之间有一些重要的用法和区别。 首先，我们需要了解export和import的基本用法。在ES2016中，export可以将一个变量、函数、类或对象导出...
一文让你彻底搞清楚javascript中的require、import与export
12-09
本文主要给大家介绍了关于javascript中require、import与export的相关内容，分享出来供大家参考学习，下面话不多说了，来一起看看详细的介绍吧。 为什么有模块概念 理想情况下，开发者只需要实现核心的业务逻辑，...
.vue文件中 import xxx from '@/xxx' 中@含义
9527的专栏
08-28 4517
@的定义在 vue.config.js中 'use strict' const path = require('path') const defaultSettings = require('./src/settings.js') function resolve(dir) { return path.join(__dirname, dir) } const name = defaultS...
require.js的用法：
Stefan_liu的专栏
05-25 742
require.js的用法： 1.作用：     1》实现js文件的异步加载，避免网页失去相应。 2》管理模块之间的依赖性，便于代码的编写和维护。 2.下载     官网下载地址：http://requirejs.org/docs/download.html#latest 3.在主界面(index.html)中引入require.js     脚本文件放到</html>结束标签下面，有...
Vue 中 import from @ 是什么意思？怎么配置？
Andrew_SJ的博客
07-02 5326
注意，如果是typescript中，其配置文件在tsconfig.json中。 比如： // /router/index.js import Home from '@views/home/index.vue' 配置文件中： // tsconfig.json { "compilerOptions": { "target": xxx; "baseURL": "./", "paths": { "@/*": ["./src/*"] }, 这里compilerOpti.
js的require、new、this机制
u012861978的专栏
04-15 731
require: 1:js里面代码可以放在不同的文件里，称为代码模块; 2:一个模块需要引用其它模块代码的时候使用 require; 3: require: (1) 如果是第一次调用，那么就加载,执行脚本; (2) 每个代码模块由module.exports 导出的对象; (3) 每次require的时候，都返回module.exports; (4)如果不是第一次执行，那么直接返回module.exports; ...
小程序------各种引用语法（import、@import、include.....）
COCOLI_BK的博客
07-12 9502
1.WXML提供两种文件引用方式import和include； 注意事项：使用inlucde的时，要注意将最后的终止符 / 添加上去，否则不能正常的导入界面内容 1.import 有作用域的概念，即只会 import 目标文件中定义的 template，而不会 import 目标文件 import 的 template。 <!-- index/index --> <...
import和@import和require三者关系
weixin_34138521的博客
10-24 598
1.@import是用于引入css文件并且只能写在css区域内（例：@import '...'或者@import url（'...'）），import用于可以引入css也可以引入js文件并且只能写在js区域内（例：import Vue from 'vue'或import 'utils/backend'或import 'element-ui/index.css'），require可以引入css，写...
JavaScript中link和@import的区别
VFrank
11-25 919
link和@import的区别
指令=@&的传值和require引用
zhenghao35791的专栏
12-21 1010
angular
js import export 写法区别
lllsj的博客
07-17 332
① export default module; import aaa from 'module'; ② export {module}; 或 export class module; 对应 import { aaa } from 'module';
js中import和require的区别
06-28
`import` 和 `require` 都是在 JavaScript 中用来导入模块的命令。但它们有一些重要的区别: 1. `import` 是 ECMAScript (ES) 模块的语法，而 `require` 是 CommonJS 模块的语法。 2. 使用 `import` 可以很容易地将...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值