首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

4 vue组件中的深层文件夹“../config.js”不工作

在Vue组件中,如果你想引用一个深层文件夹中的文件,使用相对路径时可能会遇到问题。在这种情况下,"../config.js"不工作的原因可能是路径错误或文件不存在。

为了解决这个问题,你可以采取以下步骤:

  1. 确保路径正确:首先,确认你的文件路径是正确的。使用相对路径时,"../"表示返回上一级目录。确保你的文件实际上位于所指定的路径中。
  2. 检查文件是否存在:确保你要引用的文件实际上存在于指定的路径中。如果文件不存在,那么引用它将会失败。
  3. 使用绝对路径:如果相对路径无法正常工作,你可以尝试使用绝对路径来引用文件。绝对路径是从根目录开始的完整路径,例如"/src/config.js"。使用绝对路径可以确保你能够准确地引用到文件。
  4. 使用别名:在Vue项目中,你可以配置别名来简化路径引用。在webpack配置文件中,你可以使用resolve.alias来创建别名。例如,你可以将"config"别名指向你的配置文件所在的路径,然后在组件中使用"import config from 'config'"来引用它。

总结起来,当在Vue组件中遇到"../config.js"不工作的问题时,你应该检查路径是否正确、文件是否存在,并尝试使用绝对路径或别名来解决问题。如果你需要腾讯云相关产品和产品介绍链接地址,可以提供具体的需求,我会为你提供相关信息。

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

4. 「vue@2.6.11 源码分析」new Vue() 整体流程和组件渲染之前的准备工作

场景会提供el参数,从而会执行vm.mount,组件的加载不走这里,后面分析组件加载的时候会再说到。...| children | refs: 建立父子组件vue实例关系链:parent、children,这个过程忽略中间的抽象组件实例( 添加组件生命周期相关的的标识: _inactive、_directInactive...$watch(expOrFn, handler, options) } 逻辑很显然,不赘述。 Vue.prototype.$watch Vue.prototype....$mount 我们使用的是具有运行时模板编译的版本,意味着我们在new Vue()参数中的template会被构建为render函数,这是“在线编译”的过程,它是调用 compileToFunction...在 Vue 2.0 版本中,所有 Vue 的组件的渲染最终都需要 render 方法,无论我们是用单文件 .vue 方式开发组件,还是写了 el 或者 template 属性,最终都会转换成 render

69130

「vue@2.6.11 源码分析」介绍和准备

源码目录 v2.6.11 源码 compiler: 编译的工作可以在构建时做(借助 webpack、vue-loader 等辅助插件);也可以在运行时做,即使用包含构建功能的 Vue.js ,运行时构建的代码在该文件夹中...core 目录包含了 Vue.js 的核心代码,包括内置组件、全局 API 封装,Vue 实例化、观察者、虚拟 DOM、工具函数等等。...server: ssr相关 sfc: 通常我们开发 Vue.js 都会借助 webpack 构建, 然后通过 .vue 单文件来编写组件。.../config.js会返回rollup进行构建的配置信息,指定了entry、dist等等配置信息,从而进行源码构建。...比如我们可以指定TARGET:web-runtime-dev,即走下面配置,构建产物中便不提供在运行阶段进行模板编译的能力。

65230
  • VuePress搭建技术网站与个人博客

    - title: Vue驱动 details: 享受 Vue + webpack 的开发体验,在 Markdown 中使用 Vue 组件,同时可以使用 Vue 来开发自定义主题。...在config.js中设置: module.exports = { theme: 'vuepress-theme-xx' } 可以在npm中寻找自己喜欢的主题,其中以 @vuepress/theme...上图列出了主要的布局组件,只需在其中做适量修改以满足业务需求即可。 9. md文件中使用vue组件(可选) vuepress项目中的md文件,可以直接使用vue组件。...我们可以在.vuepress文件夹下新建一个components文件夹,其中的vue组件会自动注册到全局,如下: ? 页面效果如下: ? 10....// 站点元数据 }) => { // ...做一些其他的应用级别的优化 } 这个文件类似于vue-cli脚手架中的main.js文件 四、部署上线 通过上面的工作,我们已经掌握了vuepress

    1.6K10

    💰手把手教你用VuePress如何快速搭建个人免费网站?

    在config.js中设置: module.exports = { theme: 'vuepress-theme-xx' } 可以在npm中寻找自己喜欢的主题,其中以 @vuepress/theme...执行如下命令,可将默认主题的各功能组件释放出来: vuepress eject docs 你会发现,在根目录下,多了一个theme文件夹,如下: 上图列出了主要的布局组件,只需在其中做适量修改以满足业务需求即可...9. md文件中使用vue组件(可选) vuepress项目中的md文件,可以直接使用vue组件。...我们可以在.vuepress文件夹下新建一个components文件夹,其中的vue组件会自动注册到全局,如下: 页面效果如下: 10....// 站点元数据 }) => { // ...做一些其他的应用级别的优化 } 这个文件类似于vue-cli脚手架中的main.js文件 四、部署上线 通过上面的工作,我们已经掌握了vuepress

    1.3K21

    vue3页面中,同时展示和隐藏相同的组件,后展示的组件事件监听不生效?

    场景:在实际开发中,遇到了这样一种场景,vue3页面,两个相同组件,在满足某条件下 v-if 展示第一个组件,满足另一个条件下, v-if 隐藏第一个组件,同时展示第二个组件,比如反馈组件,会通过 window.addEventListener...结果:两个相同组件一个卸载,一个挂载,第一个组监听的反馈弹窗展示和隐藏事件都可以生效,后展示的组件事件监听都不生效........、卸载时机,发现  同时卸载的组件,onBeforeUnmount 的执行时机会晚于 同时挂载组件  的 setup 时机,从而导致第二次挂载的组件的新监听的事件被第一次组件的事件卸载一次性remove...了,所以导致后一个组件的事件监听不生效。...,onBeforeMount 既有在挂载组件的 setup 之前的情况,也有之后的情况,卸载组件的 onUnmounted 既有在挂载组件的 onMounted 之前,也有可能在挂载组件的 onMounted

    41810

    快速配置webpack多入口脚手架

    ,公共字体font,公共图片img,公共方法js等;components里存放提取出来的公共组件,xhr我放的是axio的封装,整个文件夹可以自定义修改,这里就不展开了,如果项目比较简单不需要,在paths.js...再来看我们修改的entry,我们在config文件夹中的utils.js 新增了getEntry方法,并在entry处引用。...assets 静态资源 config.js 代理配置、打包地址等配置 entry 入口文件夹 demo1是一个单入口项目,demo2是一个多入口项目,如果是多入口项目,需要在entry增加对应的js文件...我们再看一下demo2中entry中的index.js和more.js // index.js import Vue from 'vue' import App from '...../More' new Vue({ el: '#more', components: { App }, template: '' }) 引入对应的组件就好,再看下config.js

    92920

    vuePress

    VuePress 由两部分组成:第一部分是一个极简静态网站生成器(opens new window),它包含由 Vue 驱动的主题系统和插件 API,另一个部分是为书写技术文档而优化的默认主题,它的诞生初衷是为了支持...config.js 配置文件 mkdir docs/.vuepress && touch docs/.vuepress/config.js 编辑 config.js 文件 module.exports...- title: Vue驱动 details: 享受 Vue + webpack 的开发体验,在 Markdown 中使用 Vue 组件,同时可以使用 Vue 来开发自定义主题。....vuepress 文件夹 这个文件是全局重要的配置文件,包括配置网站的标题、描述、主题、导航栏等信息,内容如下: module.exports = { title: "XXX的博客", description..., }, }; 9、写文章 完成了基础搭建后,按照 config.js 里面配置的目录结构,在 docs 目录下新增相应的.md 文件,一篇文章就是一个.md 文件

    57110

    vue文件中引入js_vue中require引入js

    由于build后的vue项目基本已经看不出原样,因此需要创建一个文件,并在打包的时候不会进行编译。 vue-cli 2.0的作法是在static文件下创建js。...vue-cli 3.0 的写法则是直接在public文件夹下创建js、 具体操作如下: 1、在public文件夹下创建config.js文件,里面文件的语法是es5,不允许使用浏览器不能兼容的es6语法...config.js /*自定义全局变量,此文件不编译,因此需要用原生的写法*/ let config = { networkGuard:{ accountDBID: ‘9E54B0CA55E447148211ACEA6F911FBC...应该按照原生的js文件进行使用 到此这篇关于vue引入静态js文件的方法的文章就介绍到这了,更多相关vue引入静态js文件内容请搜索云海天教程以前的文章或继续浏览下面的相关文章希望大家以后多多支持云海天教程...本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

    12.1K50

    我问导师,Vue3有没有对应工具来生成漂亮的文档? 用 Vitepress

    Vitepress 创建 SPA 导航时,它将使用每个markdown文件的路径来创建路由。 此外,任何文件夹中名为index.md的文件也只能由/引用。...文件中,有三种跳转到路由的方法 我们可以使用基本URL,添加.md或.html-所有这些都将正确链接到对应的组件。...为此,我们需要创建一个配置文件–我们可以在/docs/.vitepress/文件夹中进行此操作,该文件夹将存放我们的 Vitepress 特定文件,取名为....在Vitepress中内置元素 Vitepress 附带了对几个元素的支持,我们可以在config.js中或在Markdown中直接声明这些元素。...Github样式表 Vitepress中的表没接触过 md 的小伙伴,可能会觉得有点奇怪,如下所示: // .vitepress/config.js | Headings | Are

    1.7K20

    Vue源码探秘(一)

    引言 Vue作为当前前端开发中比较重要的框架,在企业级开发中应用十分广泛。目前也是我的主要技术栈之一。在接下来的系列文章中,我将带大家一起探秘Vue.js底层源码。...本篇文章是Vue源码探秘的第一篇。在这一篇中,我主要是带大家做一些准备工作,介绍一下flow、源码目录和源码构建流程。...编译工作可以在构建项目的时候借助 webpack、vue-loader 等插件来完成,也可以在项目运行时使用 Vue 的构建功能来完成。...的核心代码,里面包括 内置组件、全局 api,Vue 实例化、观察者(响应式数据)、虚拟 DOM、工具函数等相关代码。...文件中的 getAllBuilds 函数,先来看看这个函数在 config.js 是如何定义的: // scripts/config.js if (process.env.TARGET) { module.exports

    1.5K41

    VuePress搭建项目组件文档

    \vuepress\docs\.vuepress\components\test\test1.vue文件夹下面调用button 的 base 属性值一样 修改base 如果我们的博客部署的是.github.io(即github中与自己用户名同名的仓库),github会自动将其部署为GitPages 若我们想部署到...文件夹删除,将根目录push到github上,github目录如下: 打开设置settings,往下滑,找到GitHub Pages(一般放的是静态网站),看到绿色的,出现 Your site is...base 将会自动地作为前缀插入到所有以 / 开始的其他选项的链接中,所以你只需要指定一次。...注意事项 如果跳转404的话,检查一下 base是不是配置和github项目仓库的名字一致 码云Gitee Pages服务的网站地址均为小写,将config.js中的 base 部分全部改成小写就能解决

    48840

    最全Vue3中组件的通讯方式都整理好了,面试不怕,工作不怕,建议收藏

    "内心极度不渴望的东西,它不可能靠近你,心不唤物,物不至,若没有强烈的渴望,就看不到办法,成功就不会向我们靠近" --出自《稻盛和夫给年轻人的忠告》 01 前言 Vue中的组件通讯可以是说是工作常用,...,让大家真正掌握在Vue中组件的通讯方式,方便大家在工作或者面试中所向无敌 02 props和emit 通过props和emit进行通讯是父子组件中最常用的通讯方式了,方便,简单,好理解。...这种方式主要是解决: "当我们需要从父组件向子组件传递数据时,我们使用 props。想象一下这样的结构:有一些深度嵌套的组件,而深层的子组件只需要父组件的部分内容。...如果这些子组件都需要依赖最上面父组件的某个数据,通过props一级级的传递也可以实现,但是这样做太麻烦,也没有人会这样用所以provide和inject就可派上用场了,我们只需要在最上面的父组件中把某个数据暴露提供出去...property: 5 } }) 04 EventBus 相信大家都应该用过这种方式,在Vue最早的时候用的是: new Vue() 来充当消息总线。

    1.5K20

    vue面试题 vue-cli相关知识点(一)

    4、axios( 或者 fetch 、ajax ):用于发起 GET 、或 POST 等 http请求,基于 Promise 设计。 5、vux等:一个专为vue设计的移动端UI组件库。...npm run build 用于查看 vue-cli 生产环境部署资源文件大小的 npm命令: npm run build --report 请说出vue-cli工程中每个文件夹和文件的用处 1、build...常用到此文件夹下 config.js 配置开发环境的 端口号、是否开启热加载 或者 设置生产环境的静态资源相对路径、是否开启gzip压缩、npm run build 命令打包生成静态资源的名称和路径等。...3、dist 文件夹:默认 npm run build 命令打包生成的静态资源文件,用于生产部署。 4、node_modules:存放npm命令下载的开发环境和生产环境的依赖包。...9、src下router:vue-router vue路由的配置文件。 10、src下service:自己配置的vue请求后台接口方法。 11、src下page:存在vue页面组件的文件夹。

    1.8K31
    领券