It seems that Gulp JS, maybe likely Babel is not compatible with ag-grid-vue. Whenever I try to compile 1 get this error:
import { Component, Prop, Vue } from 'vue-property-decorator';
^
ParseError: 'import' and 'export' may appear only with 'sourceType: module'
One of my components is importing ag-grid-vue
import {AgGridVue} from 'ag-grid-vue';
My gulp task looks like:
const del = require('del');
const babelify = require('babelify');
const browserify = require('browserify');
const { src, dest, series, parallel, task } = require('gulp');
const source = require('vinyl-source-stream');
const buffer = require('vinyl-buffer');
const sourcemaps = require('gulp-sourcemaps');
const fs = require('fs');
const sass = require('gulp-sass');
const postcss = require('gulp-postcss');
const autoprefixer = require('autoprefixer');
const imagemin = require('gulp-imagemin');
const rename = require('gulp-rename');
const minify = require('gulp-minify');
const cleanCSS = require('gulp-clean-css');
task(
'js',
series(
'clean:js',
() => {
// set up the browserify instance on a task basis
var b = browserify({
entries: './_src/js/entry.js',
debug: true
})
.transform(babelify.configure({
presets: ["@babel/preset-env"]
}));
return b.bundle()
.pipe(source('site.js'))
.pipe(buffer())
.pipe(sourcemaps.init({loadMaps: true}))
.pipe(minify({
ext: {
min: '.min.js'
}
}))
.pipe(sourcemaps.write('./'))
.pipe(dest('./dist/js/'));
}
)
);
And my package.json file has the following installed:
"ag-grid-community": "^21.0.1",
"ag-grid-vue": "^25.0.0",
"vue": "^2.6.12",
Here is the full error
/Users/.../sites/vagrant/www/.../my-app/node_modules/ag-grid-vue/lib/AgGridVue.js:20
import { Component, Prop, Vue } from 'vue-property-decorator';
^
ParseError: 'import' and 'export' may appear only with 'sourceType: module'
at formatError (/usr/local/lib/node_modules/gulp-cli/lib/versioned/^4.0.0/format-error.js:21:10)
at Gulp.<anonymous> (/usr/local/lib/node_modules/gulp-cli/lib/versioned/^4.0.0/log/events.js:33:15)
at Gulp.emit (events.js:198:15)
at Gulp.EventEmitter.emit (domain.js:481:20)
at Object.error (/Users/.../sites/vagrant/www/.../my-app/node_modules/undertaker/lib/helpers/createExtensions.js:61:10)
at handler (/Users/.../sites/vagrant/www/.../my-app/node_modules/now-and-later/lib/mapSeries.js:47:14)
at f (/Users/.../sites/vagrant/www/.../my-app/node_modules/once/once.js:25:25)
at f (/Users/.../sites/vagrant/www/.../my-app/node_modules/once/once.js:25:25)
at tryCatch (/Users/.../sites/vagrant/www/.../my-app/node_modules/async-done/index.js:24:15)
at done (/Users/.../sites/vagrant/www/.../my-app/node_modules/async-done/index.js:40:12)
from gulp4 - cannot compile Vue app with AG Grid Vue
No comments:
Post a Comment