致力于Gruntfile.js为即将开展的项目组建基地.从一台新电脑开始,所以一切都是新的.使用Homebrew安装Node和NPM,然后在全局和本地目录中安装Grunt.
这是我的package.json:
{
"name": "timespent-prototype",
"version": "0.1.0",
"devDependencies": {
"assemble": "0.4.37",
"bower": "^1.4.1",
"grunt": "^0.4.5",
"grunt-contrib-concat": "^0.5.1",
"grunt-contrib-sass": "^0.9.2",
"grunt-contrib-watch": "^0.6.1",
"grunt-newer": "^1.1.0",
"grunt-wiredep": "^2.0.0"
}
}
这是我的Gruntfile.js:
module.exports = function(grunt) {
// Project configuration.
grunt.initConfig({
pkg: grunt.file.readJSON('package.json'),
concat: {
vendor: {
src: ['vendor/**/*.min.js'],
dest: 'build/javascripts/library.js',
}
},
// Takes your scss files and compiles them to css
sass: {
dist: {
options: {
style: 'expanded'
},
files: {
'build/stylesheets/application.css': 'app/stylesheets/application/index.scss'
}
}
}, …迁移到El Capitan之后,用户似乎遇到了grunt安装的问题,可能与El Capitan的无根变化有关.特别是,运行grunt --force命令会导致EPERM错误.工作流程如下:
假设已经安装了npm,使用package.json和gruntfile.js导航到grunt目录并调用grunt:
grunt --force
示例Gruntfile.js文件内容:
module.exports = function(grunt) {
// All configuration goes here
grunt.initConfig({
pkg: grunt.file.readJSON('package.json'),
concat: {
// Configuration for concatenating files goes here.
dist: {
src: [
'../js/libs/owl.carousel.js',
'../js/libs/jquery.actual.js',
'../js/libs/chosen.jquery.js',
'../js/libs/jquery.parallax.js',
'../js/src/common.js'
],
dest: '../js/pro/global.js',
},
},
uglify: {
build: {
src: '../js/pro/global.js',
dest: '../js/pro/global.min.js',
},
},
imagemin: {
dynamic: {
files: [{
expand: true,
cwd: '../img/src/',
src: ['**/*.{png,jpg,gif}'],
dest: '../img/pro/'
}]
}
},
compass: {
dev: {
options: {
sassDir: '../sass',
cssDir: '../css', … node.js gruntjs grunt-contrib-concat grunt-contrib-watch grunt-contrib-uglify
我是新来的grunt(今天安装它并使用它)和它的伟大,但我无法解决一些问题.
我有一个angularJs项目,我想将我的所有javascript文件整合为3个文件.
所以我会
"base" - 插件的所有供应商javascript文件等
"app" - 所有用户使用的所有控制器等
"admin" - 所有使用的控制器等,但只有管理员才能访问过
现在我已经安装了grunt并设置了我的concat任务,但是我怎么能有多个dest和src属性？
grunt文件的示例
grunt.initConfig({
// Metadata
pkg: grunt.file.readJSON('package.json'),
concat: {
options: {
stripBanners: true
},
dist: {
src: ['Scripts/jquery-*.js', '!Scripts/jquery-*.min.*', '!Scripts/jquery-*.intellisense.*', 'Scripts/bootstrap.js', 'Scripts/respond.js', 'js/**/*.js'],
dest: 'dist/app.js'
},
distCss: {
src: ['Content/bootstrap.css', 'Content/site.css'],
dest: 'dist/app.css'
}
},
});
一旦我弄明白这一点,我可以有多个ugilify属性来ugilify创建的每个js文件？
我正在使用Grunt来缩小和连接AngularJS Web应用程序的文件.我们的源代码位于文件共享上,我通过映射驱动器连接到它.每当Grunt在我的源目录上运行时,我的一个concat任务就会出错.错误是"ENOTSUP,套接字不支持操作".如果我复制源,本地,Grunt运行,很好.为了我们的源代码控制,我需要Grunt来监视并运行映射驱动器.concat任务使用grunt-contrib-concat.我已经尝试重新安装Node并将grunt-contrib-concat回滚到版本0.4.0.那没用.任何帮助/想法将不胜感激.
编辑:
Grunt中给出错误的代码是:
jscustom: {
src: ['src/js/*.js', 'src/js/**/*.js', 'build/temp/templates.js'],
dest: 'build/temp/custom.js'
}
如果我从上面的代码中删除"'src/js/**/*.js',"并执行我的Grunt任务,则不会发生ENOTSUP错误.我需要使用那些通配符来包含所有目录和文件.
javascript node.js azure-deployment gruntjs grunt-contrib-concat
Gruntfile的输出是一个空文件public/assets/app.js.Sass-part工作正常,但JS-part没有.
//Gruntfile
module.exports = function(grunt) {
//Initializing the configuration object
grunt.initConfig({
// Task configuration
sass: {
dist: {
options: {
style: 'compressed'
},
files: {
'./public/assets/app.css': './app/assets/scss/style.scss'
},
noCache: true
}
},
concat: {
options: {
separator: ';',
},
dist: {
src: [
'./app/bower/jquery/jquery.js',
'./app/assets/js/script.js'
],
dest: './public/assets/app.js',
},
},
uglify: {
options: {
mangle: false
},
dist: {
files: {
'./public/assets/app.js': './public/assets/app.js',
}
},
},
jshint: {
all: ['Gruntfile.js', './public/assets/app.js']
},
watch: {
js: {
files: [ …目前我正在使用grunt和grunt-contrib-concat连接我的Javascript文件,如下所示:
concat: {
options: {
separator: ';'
},
js: {
src: [
'...'
],
dest: 'main.js',
nonull: true
}
}
这非常有效.但是我也希望连接一些HTML文件,并首先执行此操作.
但是,如果我添加一个单独的任务,例如
concat: {
options: {
separator: ';'
},
js: {
src: [
'...'
],
dest: 'main.js',
nonull: true
},
html: {
src: [
'...'
],
dest: 'partials.html'
}
}
它将在;每个HTML文件之间使用相同的分隔符...
我在文档和示例中看不到任何可以帮助我的内容.
我想我可以使用一个单独的插件,也许类似于grunt-html-build,但是当我想要做的就是将它们连接起来时,这似乎有点复杂.
我可能也想在之后使用grunt-contrib-htmlmin或类似的东西,所以值得记住.
手动检查每个脚本以确保以分号结尾是否值得麻烦/开销？
围绕这个最好的方法是什么？
我正在使用grunt concat / uglify来减少加载JavaScript的调用次数。
我删除了所有到实际javascript文件的硬编码链接，现在引用了grunt生成的一个javascript文件。
如何在开发环境中继续调试/查看JavaScript？那是什么源地图？
我有一个主应用程序文件夹，其中包含许多子文件夹，每个子文件夹都有自己的子文件夹，等等，这些子文件夹包含.js文件。
我想创建一个grunt任务，将所有.js文件串联在此主顶级文件夹下的任何位置，该文件夹称为src。
反正有这样做吗？
现在，我有
cwd: '.',
src: [
'src/**/**/*.js',
'src/**/**/**/*.js',
'src/**/**/**/**/*.js',
],
dest: 'dist/app/superapp.js'
但这并不能说明所有可能的.js文件位置。而且，如果我.js在某个文件夹中添加了新文件，则不需要手动更新grunt任务。
我正在尝试将CodeKit项目转换为使用Grunt(因此我们可以支持我们的Windows好友).
在CodeKit中,您可以通过在要连接的文件中包含concat指令作为注释来连接JS文件.例如,要预先添加jquery.validate.js到您的scripts.js文件,您可以将以下注释添加到scripts.js:
/* @codekit-prepend "jquery.validate.js" */
如何根据文件本身的指令配置grunt-concat(或类似的插件)来连接JS文件？我更喜欢在文件中有concat指令,因此更清楚发生了什么(与引用Gruntfile.js相反).
javascript concatenation gruntjs codekit grunt-contrib-concat