React&FuseBox别名设置-绝对路径

夏普码

我正在将React与FuseBox一起使用。我目前遇到的问题是别名不起作用,因此我可以帮助处理相对路径问题。

我的项目结构:

资料夹结构

stores文件夹中有我的MobX商店和一个导出所有商店的index.ts文件。services有一堆服务类,所有的服务类都导出到相应的文件中(没有index.ts)

所以在我的保险丝中,我有:

alias: {
    "services": "~/services",
    "stores": "~/stores"
},

然后在我的ui文件夹中,例如,我这样导入:

import AccountStore from "stores";

[ts] Cannot find module 'stores'在“商店”的那条线上出现错误。

不确定别名部分弄错了吗?我在fuse.ts中的homeDir设置为“ src /”。像在使用webpack设置绝对路径时一样,在tsconfig中没有设置任何路径或baseUrl。不知道是否需要再次使用它们,或者我使用别名做错了什么。

任何提示将是巨大的:)

我查看了保险丝盒站点上的别名文档,并对其进行了跟踪,并尝试了几种不同的组合,但并没有更接近它的工作原理。会喜欢一些已经从这个工作的人的例子。

编辑:尝试解决此问题时,我另外做了以下操作:

  • 删除.fusebox文件夹
  • 重新启动vscode
  • 已经检查了捆绑包,并且在其中添加了波浪号,因此保险丝盒必须能够识别它吗?

会继续添加更多我尝试的东西。

夏普码

我遇到的问题的解决方案是将tsconfig.json文件放在我的src文件夹中,并将项目/应用程序放在其中~

在此处输入图片说明

在tsconfig.json中,我将baseUrl设置为root。

{
    "compilerOptions": {
        "baseUrl": ".",
        // ...
    }
}

然后,这使我可以在所有文件中进行绝对导入,因此可以轻松地重用导入并在需要时快速复制。

import { service1, service2, service3 } from '~/services';
import { store1, store2 } from '~/stores';    

代字号通常代表家庭或基于许多系统,因此一些开发人员同意在我们的文件夹结构中使用它是合适的。虽然确实要记住要从中删除~.gitignore如果您有自动生成的内容及其自动存在于其中。

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章

创建绝对路径

使用绝对路径导入React组件

如何在Expo和React Native中使用绝对路径导入?

如何使用react-router v4重定向到绝对路径?

如何在react-native中获取文件的绝对路径?

在构建React应用时将绝对路径附加到CSS / JS文件

如何方便地设置URL路径,使其与绝对路径不同?

如何使用react-native和expo获取位于assets文件夹中的文件的绝对路径?

直接从Android File Manager打开HTML页面时如何正确设置背景图像的绝对路径

如何在基于TypeScript的React Native应用程序中为导入配置绝对路径?

如何在Create React App项目中避免很长的路径并使用绝对路径?

react,react-app-rewire和Typescript的绝对路径

React Router Link绝对路径

eslint + jsconfig + nextjs模块路径别名(绝对路径导入-@)

对于Bower,在.bowerrc中设置目录设置的绝对路径

如何设置img标签在Windows和Linux中工作的绝对路径

可以在CSharpCodeProvider中设置引用的绝对路径吗?

在本地文件系统上的HTML中设置根目录的绝对路径

RequireJS:在指定配置中存在路径别名的绝对路径名时,不触发需求回调

使用React + Webpack时如何使用绝对路径导入自定义scss?

如何使用 PHP 将我的导航栏 href 设置为绝对路径?

一个字符串或脚本中命令的绝对路径变量和别名?

设置输出文件名/Gradle 时不支持绝对路径

如何在gradle中为任务设置绝对路径

如何设置绝对路径?

绝对路径在 create-react-app 中不起作用

绝对路径在 Vite 项目 React TS 中不起作用

如何在 React 或 Next.js 中使用绝对路径而不是相对路径?

React 如何使 <a> 标签始终将 href 值视为绝对路径