Use all files in a folder like a one big JS

Question

Is it possible to configure ESLint in WebStorm so functions, variables, etc. are parsed also from files in the same folder? In my build process, I concatenate all files in the same folders into big closures, for example:

   src/
      main/          ===> "main.js"
          api.js
          init.js
          ui.js
          constants.js
          .
          .
      renderer/      ===> "renderer.js"
          core.js
          events.js

I would like ESLint to treat all those files just like one, so I don't get "undef" errors for things that are defined.

If it can't be done automatically, I wouldn't mind to create a manual configuration specifying all those files if that is possible.

EDIT: Why I don't (can't) use modules? TLDR- legacy code and project requirements.

• I need to minify all code. Current closure compiler can transpile ES6 into ES5, but I found some ES6 features very prone to produce broken code. So I am forced to use ES5.

• As I need ES5. I would only be able to use require() to use modules. Now that's a problem, as require() is a dynamic include and it impacts performance on my context (big electron app for modest power devices)

So to answer @Avin_Kavish, I agree what I do is "technically non conforming", but at the end of the build process it is, because each folder has been grouped into a file. That file is the module or the script. To group the files I use a Gradle plugin https://github.com/eriwen/gradle-js-plugin, I inject a "closure header" and a "closure footer", and all the files in between in the order I want.

Despite the inconvenience, at the end I get super-compact nodeJS code, with all methods obfuscated, etc.

I ended up using @Patrick suggestion, thanks for that!

EDIT 2

WebPack + Electron-WebPack turned out to be what I was looking for.

BTW- I think the proper way to do this is if EsLint would allow a "folder" sourceType.

Answer 1

您没有在问题中提供代码示例，但我假设您做了如下操作：

\n\n

api.js

\n\n

const api = {\n  fetchData() {\n    // some code that fetches data\n  }\n};\n

\n\n

核心.js

\n\n

const core = {\n  init() {\n    api.fetchData();\n  }\n};\n

\n\n

当您 lint 这些 JavaScript 模块时导致错误的 ESLint 规则是no-undef规则。

\n\n

它检查未定义的情况下使用的变量。在上面的代码示例core.js中，这将是api，因为它是在另一个模块中定义的，而 ESLint 不知道该模块。

\n\n

您不关心这些错误，因为在生产中使用的实际 JS 包中，来自api.js和core.js 的代码连接在一个包中，因此api将被定义。

\n\n

所以实际上api在这个例子中是一个全局变量。

\n\n

该no-undef规则允许您定义全局变量，这样它们就不会导致错误。

\n\n

有两种方法可以做到这一点：

\n\n

使用注释

\n\n

在core.js模块的开头添加以下行：

\n\n

/* global api */\n

\n\n

使用 ESLint 配置

\n\n

如此处所述\xe2\x80\x93 将其添加到您的.eslintrc文件中：

\n\n

{\n  "globals": {\n    "api": "writable"\n  }\n}\n

\n\n

边注

\n\n

正如您的问题的一些评论者指出的那样，最好在模块中使用import和export语句，以及像webpack这样的模块捆绑工具，从 JavaScript 模块创建一个捆绑包。

\n