gulp4 - 无法使用 AG Grid Vue 编译 Vue 应用程序

问题描述

似乎 Gulp JS,可能 Babel 与 ag-grid-vue 不兼容。每当我尝试编译 1 时都会出现此错误

import { Component,Prop,Vue } from 'vue-property-decorator';
^
ParseError: 'import' and 'export' may appear only with 'sourceType: module'

我的一个组件是导入 ag-grid-vue

import {AgGridVue} from 'ag-grid-vue';

我的 gulp 任务如下:

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/'));
    }
  )
);

我的 package.json 文件安装了以下内容

"ag-grid-community": "^21.0.1","ag-grid-vue": "^25.0.0","vue": "^2.6.12",

这是完整的错误

/Users/.../sites/vagrant/www/.../my-app/node_modules/ag-grid-vue/lib/AgGridVue.js:20
import { Component,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)

解决方法

暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!

如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@)