我有这样的东西
define(function(require) {
var Router = require('./router');
var Backbone = require('backbone');
var Log = require('log');
...
显然,Webstorm 旨在支持 AMD 模块,但我无法让它工作,而是从项目中的每个 .js 文件中获取大量属性列表。
有没有人有幸使用 requirejs 模块完成 Webstorm 代码完成/重构?
更新 ,如果我遵循以下构造,我就能让它工作
define(['backbone', './router', './log'], function(Backbone, Router, Log) {
但是,所有路径都必须是相对的。这对于在 require.config 中配置的路径是不切实际的,因此 Backbone 没有代码完成功能。
requirejs.config({
baseUrl: 'js',
paths: {
'backbone' : '../bower_components/backbone/backbone-min',
...
另外,当有很多依赖项时,上面的语法变得很难看......
更新 2
如果您更改目录,则上述方法不起作用,例如,下面的 Log 没有获得代码完成:
define(['backbone', './router', '../utils/log'], function(Backbone, Router, Log) {
最佳答案
如上所述,对 AMD 和 CustomJS 模块的支持位于 roadmap for WebStorm 8。 .抢先体验计划 started recently仅提供 AngularJS 和 Spy-js 支持的预览,但 AMD 支持正在进行中,我希望它会出现在下一次更新中。
同时,您可以尝试Require.js plugin它为 requirejs 模块提供了部分支持。您将在 define
中获得模块依赖项的路径补全。调用,包括requirejs插件识别:
代码补全提供了如此多的“误报”,因此您最好了解对象的接口(interface)并使用“IntelliSense”作为完成长标识符的提示或帮助;我怀疑该插件在这里对 IDE 有帮助:
查找用法或重构(重命名文件和重命名对象)等其他功能在模块闭包的边界上不起作用。您最好使用路径中的替换功能...
插件注意事项:插件设置中配置文件的路径是相对于公共(public)目录(基本 URL)的。另外,我建议查看 github project site 中的二进制包。 ,它可能提供比 WebStorm 插件管理器更新的版本。 (从那里下载的 0.13 修复了插件在我的项目中崩溃的问题,而 WebStorm IDE 仍然提供 0.12。)
更新 : 问题WEB-825似乎在 WebStorm-134.1081 downloadable from EAP 中已部分修复. Find Usages 功能识别从 requirejs 依赖项初始化的形式参数,并在项目中搜索模块引用,而不是在当前闭包中搜索变量引用:
重构得到了改进。 重命名文件在项目中确实会影响所有模块引用,但它会引入到 requirejs 基本目录(URL)的相对路径。例如,重命名 toolitems.js
在 src/model
目录到 menuitems.js
将所有引用从“model/toolitems”更改为“../model/menuitems”;提供 requirejs 基本目录位于 src
目录。 重命名方法在整个项目中工作。 重命名对象 仅在当前关闭的范围内有效。应该在全局范围内工作吗?您可能会故意在使用 Require.js 的每个闭包中为相同的模块导出选择不同的对象名称......不过,为了保持一致性,使用相同的名称是一个好习惯,这里的改进会很好。
WebStorm 8 似乎不再需要为 WebStorm 7 带来部分 AMD 支持的 Require.js 插件。
更新二: Require.js 插件仍然可以帮助 WebStorm 8 用户。它识别 baseUrl
和 paths
来自 Require.js 配置。您可以将模块路径前缀映射到不同的目录根目录,但仍然需要“转到位置”功能工作:
// file configured for the Require.js config file path
require.config({
paths: {
core: '../core/src',
recman: '../recman/src',
app: '.'
}
});
// Example of a module from the app project
define([
'core/model/node', 'recman/model/hold, 'app/view/manager'
], function (NodeModel, HoldModel, ManagerView) {
...
});
关于requirejs - 如何通过 webstorm 和 requirejs 使用 AMD 代码完成?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20086068/