编译后html文件中的JS脚本不起作用

问题描述 投票:0回答:1

我在针对网络编写JavaScript的课程中吞咽活动存在问题。我定义了所有依赖关系,并将代码添加到gulpfile.js。我能够执行gulp任务和序列,但是当我尝试从dist文件夹运行index.html时,无法再添加博客。有谁知道问题出在哪里以及如何解决?

$ gulp
[17:03:58] Using gulpfile C:\cygwin64\Development\Openclassromms\JS\5493201-js-for-the-wevelopment/Openclassromms/JS/5493201-js-for-eb-gulp\gulpfile.js                         r)
[17:03:58] Starting 'default'...
[17:03:58] Starting 'processHTML'...        pment\Openclassromms\JS\5493201-js-for-the-w
[17:03:58] Finished 'processHTML' after 18 ms
[17:03:58] Starting 'processJS'...
[17:03:58] Finished 'processJS' after 12 ms s
[17:03:58] Starting 'babelPolyfill'...      
[17:03:58] Finished 'babelPolyfill' after 8.31 ms
[17:03:58] Finished 'default' after 72 ms   31 ms 

我的依存关系:

    "@babel/core": "^7.6.4",
    "@babel/preset-env": "^7.6.3",
    "babel-cli": "^6.26.0",
    "gulp": "^4.0.2",
    "gulp-babel": "^8.0.0",
    "gulp-jshint": "^2.1.0",
    "jshint": "^2.10.2"
  },
  "dependencies": {}

作为最终结果,我应该能够添加博客以显示在index.html上,即为此目的使用js文件引用,使用原始html文件以及从dist文件夹进行转译。我的gulpfile.js:

const gulp = require('gulp');
const jshint = require('gulp-jshint');
const babel = require('gulp-babel');

gulp.task('processHTML', (done) => {
    gulp.src('*.html')
      .pipe(gulp.dest('dist'));
      done();
  });
  gulp.task('processJS', (done) => {
    gulp.src('*.js')
      .pipe(jshint({
          esversion: 8
      }))
      .pipe(jshint.reporter('default'))
      .pipe(babel({
        presets: ['@babel/preset-env']
      }))
      .pipe(gulp.dest('dist'));
      done();
  });
  gulp.task('babelPolyfill', (done) => {
    gulp.src('node_modules/babel-polyfill/browser.js')
      .pipe(gulp.dest('dist/node_modules/babel-polyfill'));
      done();
  });
  gulp.task('default', gulp.series("processHTML", "processJS", "babelPolyfill"));
javascript gulp babel
1个回答
0
投票

/ gulpfile.js /

const gulp = require('gulp');
const jshint = require('gulp-jshint');
const babel = require('gulp-babel');

gulp.task('processHTML', (done) => {
    gulp.src('*.html')
      .pipe(gulp.dest('dist'));
      done();
  });
  gulp.task('processJS', (done) => {
    gulp.src('*.js')
      .pipe(jshint({
          esversion: 8
      }))
      .pipe(jshint.reporter('default'))
      .pipe(babel({
        presets: ['@babel/preset-env']
      }))
      .pipe(gulp.dest('dist'));
      done();
  });
  gulp.task('babelPolyfill', (done) => {
    gulp.src('node_modules/babel-polyfill/browser.js')
      .pipe(gulp.dest('dist/node_modules/babel-polyfill'));
      done();
  });
  gulp.task('default', gulp.series("processHTML", "processJS", "babelPolyfill"));
© www.soinside.com 2019 - 2024. All rights reserved.