问题标签 [grunt-browserify]

我正在使用 Jasmine（准确地说是 jasmine-es6：https ://github.com/vinsonchuong/jasmine-es6 ）运行单元测试，并希望将 Jasmine 配置为使用绝对路径。

在浏览我的脚本时，我将 Grunt 配置为使用“app”路径作为源文件的根目录。在浏览器中加载此类浏览器化脚本后，它可以正常工作。这是我的 Gruntfile 的一部分：

Gruntfile.js

这样我就可以在 JS 文件中的 ES6 样式导入中使用绝对路径：

app/scripts-old/application.js

而是相对路径：

app/scripts-old/application.js

现在，当我运行 Jasmine 测试时，出现以下错误：

我使用默认的 jasmine.json 配置文件。我看不到任何配置选项来设置我在项目中使用绝对路径的方式。我不想回退到使用相对路径，因为绝对路径使我的导入不可读（项目结构要复杂得多，这是简化的示例）。

还有其他测试 ES6 导入的方法吗？是否可以以其他方式配置路径？

我正在尝试将 Angular 1.6 应用程序从 ES5 移动到 ES6。index html 包含应用程序的名称：ng-app="appSuite"，我们通常使用脚本标签引用单个 js 文件。

我现在更改了 html 以引用应该包含所有源的捆绑文件，因为我已经将导入添加到 app.module.js ..

我们使用 grunt，我添加了 babel 和 browserify 步骤。app.module.js 的顶部现在有：

在 Babel 之后它变成：

然后 browserify 将其更改为：

不幸的是，当我现在运行它时：

任何人都知道我在这里缺少什么或有办法调试它吗？提前致谢，节日快乐！

我在 github 和 stackoverflow 上浏览过很多帖子。我的 package.json 中有以下开发依赖项，用于 es6 到 es5 的转换。

我已经设置了一个 grunt 任务来使用 babelify 作为转换器和 browserify 将我的 es6 文件编译为 es5。

我的 es6 js 文件正在导入一个节点模块，该模块是 es6 js 文件并作为函数导出。我尝试遵循来自各个论坛的许多建议，并查看了 babel/babelify/grunt-browserify 文档，但无法得出具体结论。

早些时候我认为，这可能是版本问题，但我现在使用的是所有 babel 6 版本和最新的 browserify/grunt-browserify 等。但是，我仍然看到以下错误：

任何帮助或指示将不胜感激。

当我运行gruntorgrunt -v时，出现错误：

我在项目根目录中，并尝试在本地、全局和没有标志的情况下安装 grunt（我是使用 npm 的初学者）

安装新/旧软件包后，我也运行npm install了几次。

这是我的package.json依赖项：

是否存在导致这种情况的差异？我在 StackOverflow 上引用了以下GitHub 线程和其他答案，并遵循了他们的建议，但不知所措。

在执行此命令之前，我没有收到此错误，如这篇关于使用 Browserify/Babel 输出多个包的文章中所示：

我不确定为什么会破坏事情。npm 不会自动安装最新的包吗？我应该尝试单独卸载这些软件包吗？

当我运行时npm install grunt，我不断看到这些警告：

这可能与问题有关吗？

谢谢

我目前正在使用 Browserify 将我的 .vue 文件构建为单个文件组件。唯一的问题是每个 SFC 都将 Vue 运行时包含在文件中，导致文件大小比它需要的大得多，因为 Vue 运行时是跨多个页面和 SFC 的通用代码。

我希望使用 Browserify 将其分离出来并跨页面加载共同点。

我已经阅读了有关该主题的大量不同文章，但无法使其中任何一篇起作用。

以下是我构建 Vue SFC 并排除运行时的方式：

然后我想像这样单独加载Javascript：

我尝试了一大堆构建 SFC 和 Vue 运行时的不同组合，但没有任何效果，而且我的想法已经用完了！

我有一个同时使用 Browserify 和 Uglify 的 Grunt 项目。以下是它的核心部分：

它似乎生成了一个myapp.min.js.map文件，但它不再具有浏览器化之前存在的源映射中的原始源。

以下是生成的源映射文件包含的内容：

我已经尝试使用uglifyifyBrowserify 的转换，但它似乎不会像 Uglify 任务那样生成小文件。

我也将所有依赖项都升级到了最新版本，但我无法解决这个问题。

我正在尝试使用 ES6 模块语法，从而将几个 JS 文件（包含导入和导出语句）打包到一个浏览器可读的文件中。

我没有收到任何错误，那么为什么我的 2 个源文件没有编译到我的一个目标文件中呢？我在这个管道中缺少什么属性？谢谢

鉴于此 TS 文件：

我正在使用如下所示的 Grunt 任务进行转换：

我运行一个简单的 HTML 文件，如下所示：

这导致Uncaught ReferenceError: Rob is not defined

我在 SO 上看到过这样的几个问题，但这些问题似乎与滥用上下文有关（例如，在不合适的情况下，不是 this-ing 的东西或 this-ing 的东西）。这里的上下文无关紧要；我只想在控制台中看到我的 console.log。

我的package.json样子是这样的：

我的步骤是

• 核弹node_modules
• 运行npm install（没有警告或错误）
• 运行grunt rob（没有警告或错误）

这会输出一个 JS 文件，在我看来是我想要的，包括这个片段：

Chrome 还告诉我rob.js加载正常，当 HTML 页面加载后，我可以在源资源管理器中看到内容。

我的问题很简单：为什么在这种情况下会出现参考错误？

编辑：作为已接受答案的补充：如果我编辑 ts 以调用自身（作为其自己的入口点）：

然后一切都按应有的方式运行——这很适合我的用例。

我有使用 webpack 的经验，并且能够为以下路径创建非常漂亮和方便的别名：

目前，我被迫使用 Grunt，我不知道如何实现相同的方法。

我希望能够至少引用包：

当前的代码是讨厌的相对：

我安装了 grunt-browserify 包，但我不知道如何正确配置它。

没有任何效果。结构很简单： src/components/ Gruntfile.js 比 src 文件夹高一级。

另外，我不使用“@”符号，但我想，这可能吗？