I am trying to run a simple bare bones grunt task and it is not working. I installed using npm install from this package:
{
"name": "ent-nmo-fasg-younger-mills-em-1",
"version": "0.1.0",
"devDependencies": {
"grunt": "~0.4.5",
"grunt-contrib-jshint": "~0.10.0",
"grunt-contrib-nodeunit": "~0.4.1",
"grunt-contrib-uglify": "~0.5.0",
"grunt-email-builder": "^3.0.1"
}
}
Then in my Gruntfile.js I have added this code:
module.exports = function(grunt) {
grunt.initConfi({
pkg: grunt.file.readJSON('package.json'),
emailBuilder: {
files : [{
expand: true,
src: ['dev/*.html'],
dest: 'dist/',
}]
}
});
grunt.loadNpmTasks('grunt-email-builder');
grunt.registerTask('dist',['emailBuilder']);
};
The error I am getting in terminal after trying to run "grunt dist" is:
Loading "Gruntfile.js" tasks...ERROR
TypeError: undefined is not a function
Warning: Task "dist" not found. Used --force, continuing.
My problem was a simple spelling error in the grunt configuration.
Related
I installed angular2-google-maps to use for google maps in my Angular 2 application.
my package.json looks like this:
{
"name": "angular2-quickstart",
"version": "1.0.0",
"scripts": {
"start": "tsc && concurrently \"npm run tsc:w\" \"npm run lite\" ",
"tsc": "tsc",
"tsc:w": "tsc -w",
"lite": "lite-server -c lite-server-conf.json",
"typings": "typings",
"docker-build": "docker build -t ng2-quickstart .",
"docker": "npm run docker-build && docker run -it --rm -p 3000:3000 -p 3001:3001 ng2-quickstart",
"postinstall": "typings install && npm run tsc"
},
"license": "ISC",
"dependencies": {
"angular2": "2.0.0-beta.14",
"systemjs": "0.19.25",
"es6-shim": "^0.35.0",
"reflect-metadata": "0.1.2",
"rxjs": "5.0.0-beta.2",
"zone.js": "0.6.6",
"angular2-jwt": "0.1.8",
"jwt-decode": "^1.5.1",
"bootstrap": "^3.3.6",
"font-awesome": "^4.6.1",
"jquery": "^2.2.3 ",
"sweetalert2": "1.3.2 ",
"flexslider": "2.6.0 ",
"angular2-google-maps": "0.9.0",
"google-fonts": "1.0.0"
},
"devDependencies": {
"concurrently": "^2.0.0",
"lite-server": "^2.2.0",
"typescript": "^1.8.9",
"typings":"^0.7.12"
}
}
I then added the relevant modules to my index.html like this:
<script src="node_modules/angular2-google-maps/bundles/angular2-google-maps.min.js"></script>
<script async defer src="https://maps.googleapis.com/maps/api/js?key=AIzaSyBBiqOVDqRdhXharDKvO4Kx6DHMdzMvVn0" type="text/javascript"></script>
My system.js configuraion:
<!-- 2. Configure SystemJS -->
<script>
System.config({
packages: {
app: {
format: 'register',
defaultExtension: 'js'
},
'angular2-google-maps': {
defaultExtension: 'js'
}
},
map: {
"angular2-jwt": "node_modules/angular2-jwt/angular2-jwt.js",
"angular2-google-maps": "node_modules/angular2-google-maps/bundles/angular2-google-maps.js"
}
});
System.import('app/main')
.then(null, console.error.bind(console));
System.import('node_modules/angular2-google-maps/bundles/angular2-google-maps.js')
.then(null, console.error.bind(console));
To use the angular2-google-maps in my component I imported it as:
import {ANGULAR2_GOOGLE_MAPS_DIRECTIVES,} from 'angular2-google-maps/core';
At first it threw the not found error(shown below) when I added the
directives: [ANGULAR2_GOOGLE_MAPS_DIRECTIVES]
but after tweaking the
system.js
configurations it was sorted.
I have a separate component main.ts that I do the bootstrapping in and I also added the module in it like this:
imported it:
import {ANGULAR2_GOOGLE_MAPS_PROVIDERS, NoOpMapsAPILoader, MapsAPILoader} from "angular2-google-maps/core";
and
bootstrap(AppComponent, [ANGULAR2_GOOGLE_MAPS_PROVIDERS,ROUTER_PROVIDERS, HTTP_PROVIDERS, FORM_PROVIDERS, BackendApis,
provide(AuthHttp, {
useFactory: (http) => {
return new AuthHttp(new AuthConfig({
tokenName: 'jwt'
}), http);
},
deps: [Http]
}),
provide(LocationStrategy, {useClass: HashLocationStrategy}),
provide(MapsAPILoader, {useClass: NoOpMapsAPILoader})
]);
Now my problem
The map loads but only after I do reloads like two or three times of the page. my console debug throws this error:
GET http://localhost:8003/node_modules/angular2-google-maps/bundles/angular2-google-maps.js/core.js 404 (Not Found)
This is freaking bad for business cos in production I don't intend to tell users to keep reloading page(and I don't want to do it either!) so I was seeking to know, is my cofiguration ok?
I have tried to tinker with the system.js configurations till I got the map to load but it looks like I brought some serious bug along. Any optimizations or pointers are appreciated.
You actually helped me solve my issue.
It seems like you are mapping to a specific location, rather than to the path you actually need when you import google maps.
Just change:
"angular2-google-maps": "node_modules/angular2-google-maps/bundles/angular2-google-maps.js"
to:
"angular2-google-maps": "node_modules/angular2-google-maps"
Also you could also remove the line and I'm sure it'll work as the paths generally default to node_modules on import.
I am new to yeoman/grunt/bower and I am working on setting up a angularjs project with:
yo angular
I made some changes to gruntfile myself and recently I found protractor very useful and I wanted to add that to my project. I followed a lot of instructions online (like this one Integrating Protractor with Yeoman via Grunt 2 years ago) but I still cannot get protractor properly installed.
Here is my Gruntfile.js: (only showed relevant parts)
'use strict';
module.exports = function (grunt) {
// Time how long tasks take. Can help when optimizing build times
require('time-grunt')(grunt);
// Automatically load required Grunt tasks
require('jit-grunt')(grunt, {
useminPrepare: 'grunt-usemin',
ngtemplates: 'grunt-angular-templates',
cdnify: 'grunt-google-cdn'
});
// Configurable paths for the application
var appConfig = {
app: require('./bower.json').appPath || 'app',
dist: 'dist'
};
// Define the configuration for all the tasks
grunt.initConfig({
// Project settings
yeoman: appConfig,
...
...
// Automatically inject Bower components into the app
wiredep: {
app: {
src: ['<%= yeoman.app %>/index.html'],
ignorePath: /\.\.\//
},
test: {
devDependencies: true,
src: '<%= karma.unit.configFile %>',
ignorePath: /\.\.\//,
fileTypes:{
js: {
block: /(([\s\t]*)\/{2}\s*?bower:\s*?(\S*))(\n|\r|.)*?(\/{2}\s*endbower)/gi,
detect: {
js: /'(.*\.js)'/gi
},
replace: {
js: '\'{{filePath}}\','
}
}
}
},
sass: {
src: ['<%= yeoman.app %>/styles/{,*/}*.{scss,sass}'],
ignorePath: /(\.\.\/){1,2}bower_components\//
}
},
...
...
// Test settings
karma: {
unit: {
configFile: 'test/karma.conf.js',
singleRun: true
}
},
protractor: {
options: {
keepalive: true,
configFile: 'protractor.conf.js'
},
run: {}
}
});
grunt.registerTask('serve', 'Compile then start a connect web server', function (target) {
if (target === 'dist') {
return grunt.task.run(['build', 'connect:dist:keepalive']);
}
grunt.task.run([
'clean:server',
'wiredep',
'concurrent:server',
'postcss:server',
'connect:livereload',
'watch'
]);
});
grunt.registerTask('test', [
'clean:server',
'wiredep',
'concurrent:test',
'postcss',
'connect:test',
'karma',
'protractor:run'
]);
};
Here is my package.json:
{
"name": "Website",
"private": true,
"devDependencies": {
"autoprefixer-core": "^5.2.1",
"compass": "^0.1.1",
"grunt": "^0.4.5",
"grunt-angular-templates": "^0.5.7",
"grunt-concurrent": "^1.0.0",
"grunt-contrib-clean": "^0.6.0",
"grunt-contrib-compass": "^1.0.0",
"grunt-contrib-concat": "^0.5.0",
"grunt-contrib-connect": "^0.9.0",
"grunt-contrib-copy": "^0.7.0",
"grunt-contrib-cssmin": "^0.12.0",
"grunt-contrib-htmlmin": "^0.4.0",
"grunt-contrib-imagemin": "^1.0.0",
"grunt-contrib-jshint": "^0.11.0",
"grunt-contrib-uglify": "^0.7.0",
"grunt-contrib-watch": "^0.6.1",
"grunt-filerev": "^2.1.2",
"grunt-google-cdn": "^0.4.3",
"grunt-jscs": "^1.8.0",
"grunt-karma": "^0.12.2",
"grunt-newer": "^1.1.0",
"grunt-ng-annotate": "^0.9.2",
"grunt-postcss": "^0.5.5",
"grunt-protractor-runner": "^3.0.0",
"grunt-svgmin": "^2.0.0",
"grunt-usemin": "^3.0.0",
"grunt-wiredep": "^2.0.0",
"jasmine-core": "^2.4.1",
"jit-grunt": "^0.9.1",
"jshint-stylish": "^1.0.0",
"karma": "^0.13.22",
"karma-jasmine": "^0.3.8",
"karma-phantomjs-launcher": "^1.0.0",
"karma2": "^0.13.22",
"phantomjs-prebuilt": "^2.1.7",
"protractor": "^3.0.0",
"time-grunt": "^1.0.0"
},
"engines": {
"node": ">=0.10.0"
},
"scripts": {
"test": "karma start test/karma.conf.js",
"install": "node node_modules/protractor/bin/webdriver-manager update"
},
"dependencies": {}
}
I used jit-grunt ( as default now ) so it will load those plugins for me.
I have surely installed protractor and grunt-protractor-runner following the post I mentioned above and other sources like official website of protractor and grunt-protractor-runner. In my local node_modules:
$ ls node_modules/ | grep protractor
grunt-protractor-runner
protractor
But no matter what I do, I am still getting the error from grunt:
$ grunt protractor
jit-grunt: Plugin for the "protractor" task not found.
If you have installed the plugin already, please setting the static mapping.
See https://github.com/shootaroo/jit-grunt#static-mappings
Warning: Task "protractor" failed. Use --force to continue.
And running grunt test:
$ grunt test
Running "clean:server" (clean) task
>> 1 path cleaned.
...
...
Running "karma:unit" (karma) task
01 05 2016 15:03:51.048:WARN [watcher]: Pattern
01 05 2016 15:03:51.094:INFO [karma]: Karma v0.13.22 server started at http://localhost:8080/
01 05 2016 15:03:51.112:INFO [launcher]: Starting browser PhantomJS
01 05 2016 15:03:52.259:INFO [PhantomJS 2.1.1 (Mac OS X 0.0.0)]: Connected on socket /#68w8QMUehAm8AAf2AAAA with id 17032121
PhantomJS 2.1.1 (Mac OS X 0.0.0): Executed 2 of 2 SUCCESS (0.003 secs / 0.026 secs)
jit-grunt: Plugin for the "protractor" task not found.
If you have installed the plugin already, please setting the static mapping.
See https://github.com/shootaroo/jit-grunt#static-mappings
Warning: Task "protractor:run" failed. Use --force to continue.
Aborted due to warnings.
Is there something I missed? I have been stuck with this for days. Any help is much appreciated.
Thanks for the suggestion and hint from #theaccordance. Turns out that JIT-grunt probably has some difficulty loading grunt-protractor-runner.
Adding grunt.loadNpmTasks('grunt-protractor-runner'); in Gruntfile.js will resolve the problem.
The accepted answer follows an anti-pattern and defeats the purpose of the JIT (Just In Time) plugin loader for Grunt.
The goal of jit-grunt is to automatically load the required plugins and thus makes the use of grunt.loadNpmTasks obsolete.
The documentation for jit-grunt explains how the plugin loader is looking for the plugins:
Will automatically search for the plugin from the task name. Search in
the following order:
node_modules/grunt-contrib-task-name
node_modules/grunt-task-name
node_modules/task-name
Since you have a task protractor, the plugin loader will try to find a corresponding plugin in this order:
grunt-contrib-protractor
doesn't exist in packages.json
grunt-protractor
doesn't exist in packages.json
protractor
found in packages.json!
unfortunately there is a mismatch
the required plugin for the task protractor is grunt-protractor-runner
In this case we can set the static mapping, as the error message points out. We do this in the format taskname: grunt_plugin_name:
// Automatically load required Grunt tasks
require('jit-grunt')(grunt, {
useminPrepare: 'grunt-usemin',
ngtemplates: 'grunt-angular-templates',
cdnify: 'grunt-google-cdn',
protractor: 'grunt-protractor-runner'
});
This is an old question, but I hope my answer can help other people who encounter this problem.
setting up a new project that will have multiple grunt tasks that I want to load from task files.
when running my first task, 'core' which is supposed to build the core css for the site, I'm getting an error that I can't seem to resolve. been doing some googling and not finding this specific issue. any issues with the same error message usually were the result of a typo or misplaced curly braces on the part of the OP. Not sure that's the case here, but perhaps someone else sees what I'm obviously not seeing.
Gruntfile.js
module.exports = function(grunt) {
grunt.initConfig({
pkg: require('./package.json')
});
grunt.loadTasks('grunt-tasks');
};
grunt-tasks/grunt-core.js
module.exports = function (grunt) {
grunt.loadNpmTasks('grunt-sass');
grunt.config('core', {
sass : {
options : {
sourceMap : true,
includePaths : 'node_modules/bootstrap-sass/assets/stylesheets'
},
dist : {
files : {
'main.css' : 'main.scss'
}
}
}
});
grunt.registerTask('core', ['sass:dist']);
};
error:
$ grunt core
Running "sass:dist" (sass) task
Verifying property sass.dist exists in config...ERROR
>> Unable to process task.
Warning: Required config property "sass.dist" missing. Use --force to continue.
Aborted due to warnings.
I've tried a few different things. If I change the registerTask to this:
grunt.registerTask('core', ['sass']);
I get this error:
$ grunt core
>> No "sass" targets found.
Warning: Task "sass" failed. Use --force to continue.
Aborted due to warnings.
not sure if this is relevant, but here is package.json and some specs on the system I'm using.
Mac OSX Yosemite
node version v5.10.1
npm 3.8.3
package.json
{
"name": "TEST",
"version": "1.0.0",
"description": "test test test",
"main": "Gruntfile.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"repository": {
"type": "git",
"url": "https://github.com/path/to/repo"
},
"author": "me <me#example.com>",
"license": "ISC",
"bugs": {
"url": "https://github.com/path/to/repo/issues"
},
"homepage": "https://github.com/path/to/repo",
"devDependencies": {
"angular": "^1.5.5",
"bootstrap-sass": "^3.3.6",
"grunt": "^1.0.1",
"grunt-contrib-jshint": "^1.0.0",
"grunt-contrib-uglify": "^1.0.1",
"grunt-contrib-watch": "^1.0.0",
"grunt-sass": "^1.1.0",
"jquery": "^2.2.3",
"sass-lint": "^1.5.1"
},
"dependencies": {
"jquery": "^2.2.3"
}
}
Looks like it was user error on my part.
in the task file, I had grunt.config(), but I should have had grunt.initConfig()
var taskConfig = {
sass : {
options : {
sourceMap : true,
includePaths : 'node_modules/bootstrap-sass/assets/stylesheets'
},
dist : {
files : {
'main.css' : 'main.scss'
}
}
},
concat : {
core : {
src : ['node_modules/jquery/dist/jquery.js', 'js/main.js'],
dest : "../dev/js/main.js"
}
}
};
module.exports = function (grunt) {
grunt.loadNpmTasks('grunt-contrib-concat');
grunt.loadNpmTasks('grunt-sass');
grunt.initConfig(taskConfig);
grunt.registerTask('core', ['concat:core','sass']);
};
I am trying to set up some simple Grunt tasks but upon running them I get a Warning in the terminal "Warning: Task "default" not found.
I have simplified the gruntfile down to just one task, to reduce the chance this was caused by syntax errors but I am still getting the same warning...
gruntfile.js
exports.module = function (grunt) {
grunt.initConfig({
pkg: grunt.file.readJSON('package.json'),
uglify: {
build: {
files: {
'/public/scripts/test.min,js' : ['/public/scripts/test.js']
}
}
}
});
grunt.loadNpmTasks('grunt-contrib-uglify');
grunt.registerTask('default', ['uglify']);
};
package.json
{
"name": "CustomersCRUD",
"version": "0.0.1",
"description": "Customer CRUD Application",
"main": "app.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"author": "Dan Hutchinson",
"license": "ISC",
"dependencies": {
"express": "^4.6.1",
"serve-favicon": "^2.0.1"
},
"devDependencies": {
"grunt": "^0.4.5",
"grunt-contrib-uglify": "^0.5.0"
}
}
warning given
Warning: Task "default" not found. Use --force to continue.
Aborted due to warnings.
Many thanks!
Okay, didn't catch this before but it's module.exports not exports.module
That should fix it. Also, I don't believe your file references need a / before them.
I see a comma here: '/public/scripts/test.min,js'
Could that be your issue?
I'm using Jasmine 1.3 with RequireJS and Grunt. I have a grunt task that does this:
jasmine: {
app: {
options: {
outfile: "<%= config.testPath() %>/jasmine_runner/_SpecRunner.html",
specs: ["<%= config.testPath() %>/specs/*Spec.js"],
template: require('grunt-template-jasmine-requirejs'),
templateOptions:{
requireConfigFile: ['<%= config.appPath() %>/js/config.js','<%= config.testPath() %>/specs/testConfig.js']
}
}
}
}
From the command line, I execute grunt jasmine which gives this error:
Running "jasmine:app" (jasmine) task
Warning: boot is not defined Use --force to continue.
Aborted due to warnings.
PhantomJS is set up to run it in the background. I have done extensive search on what the boot error means but haven't found anything.
Try updating your version of grunt-contrib-jasmine.
Upgrading from 0.5.1 to 0.7.0 fixed this issue for me.
Here's my package.json for reference:
{
"name": "...",
"version": "0.1.0",
"description": "...",
"devDependencies": {
"grunt": "^0.4.5",
"matchdep": "^0.3.0",
"grunt-contrib-concat": "^0.4.0",
"grunt-contrib-uglify": "^0.5.0",
"grunt-contrib-watch": "^0.6.1",
"grunt-contrib-compass": "^0.9.0",
"grunt-contrib-requirejs": "~0.4.4",
"grunt-contrib-jasmine": "~0.7.0",
"grunt-template-jasmine-requirejs": "~0.2.0"
},
...
}