个人中心
文章发布
退出
作者热门文章
- html - 出于某种原因，IE8 对我的 Sass 文件中继承的 html5 CSS 不友好？
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景？
24
4
我是第一次使用 Grunt。其他人已经设置/配置了 Gruntfile.js 配置文件。虽然它有效，但我发现非常烦人的是我的所有 js 文件都被缩减为带有映射文件的单个 app.min.js 文件。
因此，即使这有效，当我遇到错误或错误时，也不可能知道哪个源文件导致了 JS 错误。
有没有办法配置 Grunt 不将所有内容压缩到单个文件中，而是将所有内容保留为单独的包含内容？我喜欢只需要在 html 中包含一个 JS 的功能。
grunt.initConfig({
pkg: grunt.file.readJSON('package.json'),
jsFilesApis: [
'client/vendors/apis/jquery-1.11.0.min.js',
'client/vendors/apis/bootstrap.min.js',
'client/vendors/apis/angular.1.2.16.min.js',
.....
],
jsFilesApp: [
'client/app/**/*.js'
],
'angular-injector': {
test: {
expand: true, // required
token: 'ng', // optional
src: '<%= jsFilesApp %>',
dest: 'build/'
}
},
uglify: {
dist: {
files: {
"build/app.min.js": '<%= jsFilesApp %>',
"build/apis.min.js": '<%= jsFilesApis %>'
},
options: {
mangle: false,
compress: false,
sourceMap: true
}
},
},
});
我的 HTML 是:
<html ng-app='app'>
<head>
<script type="text/javascript" src="./build/apis.min.js"></script>
<script type="text/javascript" src="./build/app.min.js"></script>
</head>
...
如何配置 Grunt，以便可以单独包含所有 JS 文件，以便能够在浏览器中适本地查看/调试它们？
最佳答案
对于初学者来说，没有办法只在所有 JavaScript 中包含一个脚本标记，同时将它们在源代码中保持独立。我不知道有 grunt 插件或其他插件可以将您的 javascript 连接到单个脚本中，但允许您在浏览器中单独查看它们(如链轮)。
但是，我拥有的是一个可以查看的非缩小脚本(正在开发中)。它不会立即向您显示它来自哪个库或文件，但您至少可以看到代码。
我所拥有的是(使用grunt-contrib-concat)
concat: {
'build/<%= pkg.name %>.js': ['build/vendor.js', 'build/app.js', 'build/templates.js']
},
对你来说会是这样的
concat: {
"build/app.js": '<%= jsFilesApp %>',
"build/apis.js": '<%= jsFilesApis %>'
},
然后将这两个内容都包含在您的 html 中。您还需要指定不要在开发版本上进行丑化。对我来说，这看起来像
grunt.registerTask('build:dev', ['clean:dev', 'browserify:app', 'browserify:test', 'emberTemplates', 'jshint:dev', 'less:transpile', 'concat', 'copy:dev']);
所以对你来说就是
grunt.registerTask('build:dev', ['angular-injector', 'concat']);
grunt.registerTask('build:prod', ['angular-injector', 'concat', 'uglify']);
关于javascript - 如何使用 Grunt 而不将所有内容压缩到单个文件中，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/25049383/
24
4
0
我安装了 grunt 和 grunt cli，但仍然出现命令未找到错误 { "name": "angulartdd", "version": "1.0.0", "description":
我有一个使用“grunt-contrib-watch”和“grunt-exec”的 Grunt.js 文件，这是因为我想以一种独特的方式使用 handlebars 预编译器的一些自定义功能。 代码:
我正忙于尝试完成我正在运行的部署脚本。它可能有一半的时间有效，而且令人沮丧，因为我使用的大部分代码都不是我写的。我真的希望有一个我可以执行的较低级别的解决方法。 基本上发生的事情是我正在尝试执行 5
我想像在文档中定义的那样将参数传递给grunt-shell: module.exports = function(grunt) { // Configure Grunt grunt.initConfi
背景 我正在使用 Yeoman webapp 来搭建我的前端。 在 gruntfile 中，他们使用 grunt-rev 和 grunt-usemin Grunt-rev 将“修改”我的 Assets
我已经设置了grunt-eslint在我的 gruntfile.js 中，但是当我运行“grunt eslint”时，什么也没有发生。该任务看似即将开始，但 15 分钟后却停滞不前。 我的所有其他任务
我最近开始使用 grunt 做 JS 项目。 我有一个名为“grunt-contrib-jasmine”的插件用于 Jasmine 测试。我工作得很好，但我无法在浏览器中通过 specrunner 运
谁能告诉我这里做错了什么(我是 grunt 的新手)一个大学给我提供了一个基本的 gruntfile 设置 我已经安装了 node、js 和 grunt，但我不知道如何安装各种包(uglify、con
我正在尝试使用 grunt-contrib-watch和 grunt-rsync将任何文件更改上传到我的开发服务器。这是我的设置: var path = require('path'); module
尝试使用grunt-kill创建一个任务来终止我的 server-scorm 任务，并最终终止所有相关任务。这些说明非常短，因为它假设我知道有关 PID 文件的所有信息(我不知道，不是开发人员的错误)
我要么脑子一片空白，要么本该更复杂。 我正在尝试从 Grunt 任务运行 grunt-init，如下所示: grunt.registerTask('init', 'Scaffold various a
我有一个从玩家发射的射弹预制件，当它与“边界”碰撞时，它应该摧毁自己，当它击中“咕噜声”时，它应该摧毁自己和咕噜声。但是，当它碰到边界时，它会破坏自身和边界的对撞机。我创建了一个自定义标签脚本，允许我
module.exports = function(grunt){ grunt.initConfig({ pkg: grunt.file.readJSON('package.json'),
我已经加入了一个非营利性开源项目，想帮点忙，但我对 Grunt 不熟悉。我做了一些研究，但无法弄清楚为什么配置不起作用。 这是我正在尝试使用的插件。它允许应用多个后处理器，但我现在只需要 Autopr
下面的代码读取app/modules/中的每个子目录js的内容(例如app/modules/module1/js/, app/modules/module2/js/, aso.) 此脚本在不使用最后一
我正在尝试使用 grunt-exec 运行一个 javascript 测试运行程序，并传入一个已部署的链接变量。 我尝试通过使用 exec:setLink 设置环境变量 grunt.option('l
当我使用 grunt-contrib-watch 更改我的 js 文件时，我试图让 Grunt 重新加载它们。这是我的 Gruntfile: module.exports = function(gru
所以我的意思是: grunt.registerTask('default', ['default']); // CLI: grunt grunt.registerTask('serve', ['ser
我想创建一个通用的顶级 Gruntfile.js，配置为监视较少的文件更改。当less文件发生变化时，我想将其编译为css，然后在浏览器中实时加载css文件。我的功能正常，但我必须为每个项目复制 Gr
我正在使用 grunt-xmlpoke 更新 xml 文件。 xml 文件的路径作为参数提供。问题是文件部分中的第一个 WebConfigPath (键)被视为字符串。它更新了我的 xml 文件的本地
我是一名优秀的程序员,十分优秀！