I'm new to front-end development and I have some existing project which I unable to run.
Documentation says, to run the project I should execute:
$ gulp && gulp serve
However, I receive the following error:
/home/alex/some/project/node_modules/@types/gulp/index.d.ts(15,15): error TS2430: Interface 'Gulp' incorrectly extends interface 'Orchestrator'.
Types of property 'task' are incompatible.
Type 'AddMethod' is not assignable to type '{ (name: string): Task; (name: string, fn: TaskFunc): void; (name: string, dep: string[], fn: Tas...'.
Type 'Orchestrator' is not assignable to type 'Task'.
Property 'fn' is missing in type 'Orchestrator'.
What did I miss?
Update:
Here is my package.json
{
"name": "test",
"version": "0.0.1",
"description": "Some | description",
"author": "Author name",
"homepage": "http://sample.org",
"private": true,
"devDependencies": {
"@types/angular": "^1.5.5-alpha",
"@types/gulp": "^3.8.32",
"@types/node": "^6.0.52",
"autoprefixer": "^6.5.2",
"browser-sync": "^2.18.5",
"chai": "^3.5.0",
"chai-as-promised": "^5.3.0",
"del": "^2.2.2",
"eslint": "^3.9.1",
"eslint-config-angular": "^0.5.0",
"eslint-plugin-angular": "^1.4.1",
"gulp": "^3.9.1",
"gulp-angular-filesort": "^1.1.1",
"gulp-angular-templatecache": "^2.0.0",
"gulp-autoprefixer": "^3.1.1",
"gulp-clean": "^0.3.2",
"gulp-concat": "^2.6.1",
"gulp-cssmin": "^0.1.7",
"gulp-eslint": "^3.0.1",
"gulp-htmlmin": "^3.0.0",
"gulp-if": "^2.0.2",
"gulp-imagemin": "^3.1.1",
"gulp-inject": "^4.1.0",
"gulp-jade": "^1.1.0",
"gulp-jscs": "^4.0.0",
"gulp-jsdoc3": "^1.0.1",
"gulp-load-plugins": "^1.4.0",
"gulp-print": "^2.0.1",
"gulp-replace": "^0.5.4",
"gulp-rev": "^7.1.2",
"gulp-sass": "^3.0.0",
"gulp-sourcemaps": "^2.4.1",
"gulp-stylelint": "^3.9.0",
"gulp-tslint": "^7.0.1",
"gulp-typescript": "^3.1.3",
"gulp-uglify": "^2.0.0",
"gulp-util": "^3.0.8",
"husky": "^0.13.1",
"jasmine": "^2.5.2",
"jshint": "^2.9.4",
"karma": "^1.3.0",
"karma-angular": "^0.0.6",
"karma-chai": "^0.1.0",
"karma-chai-as-promised": "^0.1.2",
"karma-mocha": "^1.3.0",
"karma-phantomjs-launcher": "^1.0.2",
"karma-requirejs": "^1.1.0",
"merge-stream": "^1.0.1",
"mocha": "^3.1.2",
"path-exists": "^3.0.0",
"phantomjs-prebuilt": "^2.1.13",
"requirejs": "^2.2.0",
"run-sequence": "^1.2.2",
"rxjs": "^5.0.1",
"serve-static": "^1.11.1",
"simple-git": "^1.65.0",
"stream-series": "^0.1.1",
"tslint": "^4.3.1",
"typescript": "^2.1.4",
"wiredep": "^4.0.0",
"yargs": "^6.5.0"
},
"engines": {
"node": ">=0.10.0"
},
"scripts": {
"postinstall": "bower install",
"start": "npm install",
"js-doc": "rm -rf ./docs && gulp js-doc && open docs/gen/global.html",
"precommit": "node enforceLinter.js"
}
}
Here is a serve
task in my gulpfile.js
gulp.task("serve", ["copymapdata", "imagemin", "copyfonts", "copyskins", "copyother", "inject"], () => {
browserSync.init({
open: true,
port: 8000,
reloadDelay: 3000,
server: {
baseDir: ".tmp",
routes: {
"/bower_components": "./app/bower_components"
},
cors: true,
middleware: function(req, res, next) {
res.setHeader("Access-Control-Allow-Origin", "*");
res.setHeader("Access-Control-Allow-Headers", "*");
next();
}
}
});
gulp.watch(config.allcss, ["styles"]);
gulp.watch(config.alljs, ["js-watch"]);
gulp.watch(config.alljade, ["jade-watch"]);
gulp.watch(config.allts, ["ts-watch"]);
});
Update your gulp to latest version "@types/gulp": "^4.0.3"