I have started to integrate JavaScript 2015 (ES6) into my Ionic v1 app:
package.json
{
"name": "test",
"version": "1.0.0",
"dependencies": {
"@ionic-native/deeplinks": "^4.18.0",
"cordova-android": "7.0.0",
"cordova-android-support-gradle-release": "1.2.1",
"cordova-common": "1.5.1",
"cordova-plugin-app-event": "1.2.1",
"cordova-plugin-camera": "4.0.2",
"cordova-plugin-datepicker": "git+https://github.com/VitaliiBlagodir/cordova-plugin-datepicker.git",
"cordova-plugin-device": "2.0.1",
"cordova-plugin-google-analytics": "1.7.11",
"cordova-plugin-inappbrowser": "2.0.2",
"cordova-plugin-network-information": "2.0.1",
"cordova-plugin-splashscreen": "5.0.2",
"cordova-plugin-whitelist": "1.3.3",
"cordova-plugin-x-socialsharing": "5.3.2",
"de.appplant.cordova.plugin.local-notification": "0.8.5",
"es6-promise-plugin": "4.2.2",
"ionic-native": "^2.9.0",
"ionic-plugin-deeplinks": "^1.0.17",
"ionic-plugin-keyboard": "2.2.1",
"parse-push-plugin": "^1.0.7"
},
"devDependencies": {
"@babel/core": "^7.2.2",
"babel-loader": "^7.1.5",
"babel-preset-es2015": "^6.24.1",
"bower": "1.3.3",
"gulp": "3.8.10",
"gulp-babel": "^8.0.0",
"gulp-concat": "2.2.0",
"gulp-minify-css": "0.3.0",
"gulp-plumber": "^1.2.1",
"gulp-rename": "1.2.0",
"gulp-sass": "2.2.0",
"gulp-util": "2.2.14",
"ionic-minify": "2.0.10",
"shelljs": "0.3.0"
},
"cordovaPlugins": [
"cordova-plugin-inappbrowser",
"cordova-plugin-whitelist",
"cordova-plugin-splashscreen",
"cordova-plugin-camera",
"cordova-plugin-x-socialsharing",
"ionic-plugin-keyboard",
"cordova-plugin-datepicker",
"cordova-plugin-network-information",
"de.appplant.cordova.plugin.local-notification",
"<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="0e7e6f7c7d6b237e7b7d66237e627b6967604e3f203e2039">[email protected]</a>",
"<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="e784889583889186ca978b92808e89ca808888808b82ca8689868b9e938e8494a7d6c9d0c9d6d6">[email protected]</a>",
"cordova-custom-config",
"ionic-plugin-deeplinks"
],
"cordovaPlatforms": [
"android"
],
"cordova": {
"plugins": {
"cordova-plugin-datepicker": {},
"cordova-plugin-network-information": {},
"cordova-plugin-inappbrowser": {},
"cordova-plugin-whitelist": {},
"cordova-plugin-splashscreen": {},
"cordova-plugin-camera": {},
"cordova-plugin-x-socialsharing": {},
"ionic-plugin-keyboard": {},
"de.appplant.cordova.plugin.local-notification": {},
"cordova-android-support-gradle-release": {
"ANDROID_SUPPORT_VERSION": "26"
},
"parse-push-plugin": {},
"cordova-plugin-google-analytics": {},
},
"platforms": []
}
}
gulpfile.js:
var gulp = require('gulp');
var babel = require("gulp-babel");
var plumber = require("gulp-plumber");
var sass = require('gulp-sass');
var minifyCss = require('gulp-minify-css');
var rename = require('gulp-rename');
var paths = {
es6: ['./src/es6/*.js'],
sass: ['./scss/**/*.scss']
};
gulp.task('default', ['babel', 'sass']);
gulp.task("babel", function () {
return gulp.src(paths.es6)
.pipe(plumber())
.pipe(babel({presets: ['es2015']}))
.pipe(gulp.dest("www/js"));
});
gulp.task('sass', function(done) {
gulp.src('./scss/ionic.app.scss')
.pipe(sass())
.pipe(gulp.dest('./www/css/'))
.pipe(minifyCss({
keepSpecialComments: 0
}))
.pipe(rename({ extname: '.min.css' }))
.pipe(gulp.dest('./www/css/'))
.on('end', done);
});
gulp.task('watch', function() {
gulp.watch(paths.es6, ['babel']);
gulp.watch(paths.sass, ['sass']);
});
While attempting to run "gulp babel," I encountered the following error:
Error in plugin "gulp-babel"
Message:
Plugin/Preset files are not allowed to export objects, only functions.
I suspect that this issue is related to incorrect version settings in devDependencies.
Despite trying different versions, I am still encountering errors.
If anyone can offer assistance in resolving this problem, it would be greatly appreciated.