vue配置src（@）地址（vue）

weixin_43677787

已于 2022-01-19 18:54:08 修改

阅读量449

点赞数

文章标签： vue.js 前端 javascript

于 2022-01-19 18:39:21 首次发布

本文链接：https://blog.csdn.net/weixin_43677787/article/details/122587482

版权

步骤：新建jsconfig.json文件（vue create 项目名称 | vue ui 创建项目使用）

{
  "compilerOptions": {
    "baseUrl": "./",
    "paths" : {
      "@/*": [
        "src/*"
      ]
    },
  },
  "exclude": [
    "node_modules",
    "dist"
  ]
}

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

weixin_43677787

关注关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
复制链接

分享到 QQ

分享到新浪微博

扫一扫

深入浅析vue-cli@3.0 使用及配置说明

10-17

vue-cli@3.0创建的项目遵循一定的目录结构，其中src目录包含用户主要的源代码，public目录存放静态资源，而package.json文件管理项目依赖和脚本。四、环境变量配置环境变量的配置对于项目在不同环境下的运行至关...

vue基础-src路径问题

weixin_41357609的博客

03-18

1016

基于webpack 的vue-cli项目基本：@==> 代表了src目录通过： 1、http://localhost:8080/src 是找不到 vue项目的src目录 2、通过url访问是可以访问到public目录的 template 写的路径，可以直接找到对应的文件定义数据的路由，只需要在public中放入文件

参与评论您还未登录，请先登录后发表或查看评论

vue2.0_vue中配置@开头的路径

QiuRenBB的博客

04-27

5057

安装path npm install path --save 在vue.config.js中进行配置 let path = require('path'); function resolve (dir) { return path.join(__dirname, dir) } module.exports = { chainWebpack: (config) => { config.resolve.alias .set('@', resolve('src'))

【Vue】vue3 动态设置 src 地址方法

日常问题bug解决、学习分享、个人杂谈等等随便写写哈哈哈

10-17

1026

<img class="logo-srkg" :src="getImgUrl('hwtm.png')" alt="" /> const getImgUrl = (src: string): string => { return new URL(`../assets/res-kg/${src}`, import.me...

如何在vue项目中配置引用路径“@”

热门推荐

m0_60692814的博客

09-11

1万+

配置引用路径（以@引用为项目的src目录为例）可拆分为如下两步操作配置webpack打包时将@解析为项目的src目录配置vsCode在路径中输入@时的路径提示本贴着重讲解“配置webpack打包时将@解析为项目的src目录”的操作和溯源操作在项目根目录的vue.config.js文件中做如下配置 const path = require('path') module.exports = { configureWebpack: { resolve: {

vue 如何配置@绝对路径

who_become_gods的博客

02-25

1万+

第一种：直接使用@ vue项目中默认定义了@（最常用）和vue$两个别名， @这东西代表着到src这个文件夹的路径，下面所属目录可以直接 @/views @/components @/store @/router @/assets ├── vue.config.js ├── package.json ├── babel.config.js ├── public └──index.html ├── src └── assets └── com

Vue中图片Src使用变量的方法

10-16

在Vue.js框架中，开发过程中经常需要根据不同的条件或数据动态地设置图片的源（Src）。这通常是通过绑定变量到`<img>`标签的`src`属性来实现的。本篇文章将详细介绍Vue中图片Src使用变量的方法，以及解决在实际应用...

详解vue配置后台接口方式

10-17

在src目录下的api模块文件，比如user.js，我们可以按照代理配置书写请求： ```javascript import axios from 'axios'; export function getIdcsList() { return axios.get('/api/idcs/'); } export function ...

vue设置全局访问接口API地址操作

11-20

首先，在Vue项目的`src`目录下创建一个名为`interface`的新文件夹，并在其中创建`index.js`文件。在这个文件中，我们将定义全局的API地址： ```javascript // src/interface/index.js let commonUrl = ...

vue安装及环境配置.docx

最新发布

07-11

你可以在浏览器中访问这个地址，查看 Vue 应用的默认页面。 ##### 5. 进行基本配置在项目创建完成后，你可以根据具体需求对项目进行配置和定制。这包括修改默认的 Vue 组件、添加第三方库、配置路由、状态管理等...

vue配置src的快捷路径以及跨域问题的解决

m0_56986233的博客

03-26

1285

1.配置src的快捷路径@ 在目录下新建一个jsconfig.json文件，输入一下内容即可 { "compilerOptions": { "baseUrl": "./", // 配置src文件 "paths": { "@/*": [ "src/*" ] } }, "exclude": [ "node_modules", "dist" ] } 接下来就可以直接用@了。此时的@表示src文件夹跨域解决

Vue 配置根目录（用@代替src）

小f要努力啦的博客

09-04

2271

vue配置根目录

vue中src图片路径的写法

zouyang920的博客

12-16

8386

/这个符号就是直接代表项目的根目录。

Vue图片的src

Virus

12-09

318

我们在用vue渲染页面时，经常会涉及到图片，到是如果按照下面这样，一定会出现问题 <img src="{{item.jpg}}" 因为计算机会直接把花括号内容当做路径来解析，这肯定是会出现问题的。因此我们借助v-bind来解决这个问题 <img v-bind:src="{{}}"> 或者不加花括号 <img :src="item.jpg"> 我们在在遍历图片...

vue项目中@/src路径跳转配置

zmx781284440的博客

03-12

1127

在vscode中安装Vue Jumper这个插件，可支持。(ctrl+鼠标左键点击组件名)

vue项目启动报错 in ./src/App.vue?vue&type=style&index=0&lang=scss解决办法

草莓味的青

07-21

1万+

vue项目启动报错：in ./src/App.vue?vue&type=style&index=0&lang=scss解决办法

vue静态资源的引用(相对路径,绝对路径,@,~的一些笔记,以图片引入为例,含在线演示)

动感超人的博客

08-21

1万+

vue引入静态资源有相对路径和绝对路径的方式相对路径是URL开头有.绝对路径是URL开头为/或者省略不写相对路径相对的是当前文件绝对路径相对的是public目录并且引入的时候URL开头为~的使用在css里面引入静态资源的时候如果 URL 以 @ 开头会作为一个模块请求被解析。Vue CLI 默认会设置一个指向 src 的别名 @。

vue中引入路径用法及说明

zzy7075的专栏

03-07

2875

vue中引入路径@的用法及说明

手写VUE后台管理系统2 - 配置@表示src路径

死牛胖子的技术随笔

07-06

4924

使用 @ 表示项目的 src 目录

webpack搭建的vue怎么配置@/

04-02

在webpack搭建的vue项目中，可以通过配置resolve.alias来设置@/指向的路径。具体方法如下： 1. 打开webpack配置文件，一般为webpack.config.js。 2. 找到resolve配置项，如果没有则需要添加。 3. 在resolve配置项...