英文:
Imports after building ES module with webpack and babel are not highlighted in Intellij Idea
问题
为了将来的代码维护，有必要让环境（在我这里是IntelliJ IDEA 2021.1.3）突出显示来自内部工作仓库的自定义模块的导入。项目使用通过Babel传递的一个模块，这是一组从node_modules中加载的导出函数，文件路径如下：
project_name/node_modules/@modules/my-custom-module/dist/module.js
项目中导入的一个示例：
import { First, Second, Third } from '@modules/my-custom-module'
Idea显示'无法解析符号First'（Second、Third也是一样）
它构建并正常工作，但Idea看不到这些函数本身，自动完成也无法工作。起初，我以为是构建工具的问题，因为在原始形式中，代码可以正常导入并且函数会被突出显示，也许这就是问题所在。经过长时间的搜索，我找到了别名的解决方案，它们可以在webpack、babel、package.json中配置，还可以创建一个根jsconfig.json文件。webpack的选项不适用，因为它不影响环境的可见性，实际上只是为了更方便地理解路径。现在我正在尝试jsconfig.json：
{
"compilerOptions": {
"baseUrl": ".",
"paths": {
"modules/*": ["./node_modules/@modules/my-custom-module/dist/*"]
}
}
}
Idea没有任何反应，要么是我错误地指定了路径，要么是我在做一些错误的事情，有没有人已经遇到过类似的问题？
英文:
For future code maintenance, it is necessary to make the environment (in my case intellij idea 2021.1.3) highlight imports from custom modules of the internal working repository. The project uses a module passed through Babel, which is a set of exported functions that is loaded from the repository in node_modules, the file path looks like this:
project_name/node_modules/@modules/my-custom-module/dist/module.js
An example of an import in a project:
import { First, Second, Third } from '@modules/my-custom-module'
The Idea says 'cannot resolve symbol First' (and same with Second, Third)
It builds and works fine, but the idea doesn't see the functions themselves and the autocomplete doesn't work. At first I thought something was wrong with the builder, because in raw form, the code is imported normally and the functions are highlighted, perhaps this is the problem. A long search led me to alias, they can be configured in webpack, babel, package.json and you can create a root jsconfig.json file. The option with webpack did not fit, because. this did not affect the visibility of the environment, in fact, the usual customization of paths, for convenient perception. Now I'm trying jsconfig.json:
{
"compilerOptions": {
"baseUrl": ".",
"paths": {
"modules/*": ["./node_modules/@modules/my-custom-module/dist/*"]
}
}
}
The idea does not react in any way, or I incorrectly indicate the path, or I am doing garbage, has anyone already faced a similar task?
答案1
得分: 0
只有在我创建了我的模块并将其上传到GitHub后才发现，原来这些模块是与我的同事没有添加到Git中的源代码一起构建的！因此，IDE完美地引入了导入项，并在构建后将转译后的代码放在dist目录中。多么愚蠢的情况！
pacakge.json
{
"name": "@modules/my-custom-module",
"main": "dist/module.js",
"esnext": "src",
"files": [
"README.md",
"dist",
"src"
]
}
英文:
It turned out only after I created my module and uploaded it to github, it turns out that the modules are built together with sources that my colleagues did not add to git! Thus, the IDE perfectly pulls up imports, and after assembly, the transpiled code is located in the dist. What a stupid situation!
pacakge.json
{
"name": "@modules/my-custom-module",
"main": "dist/module.js",
"esnext": "src"
"files": [
"README.md",
"dist",
"src"
],
}
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论