基本NPM，Gulp設置

Question

我試圖自動化我的前端開發，所以我首先使用NPM引入依賴關系。 我的package.json看起來像：

"main": "main.js",
"dependencies": {
  "jquery": "^2.1.4",
  "vue": "^0.12.8"
},
"devDependencies": {
  "gulp": "^3.9.0",
  "gulp-autoprefixer": "^2.3.1",
  "gulp-browserify": "^0.5.1",
  "gulp-concat": "^2.6.0",
  "gulp-minify-css": "^1.2.0",
  "gulp-notify": "^2.2.0",
  "gulp-rename": "^1.2.2",
  "gulp-sass": "^2.0.4",
  "gulp-uglify": "^1.2.0"
}

我的gulpfile.json看起來像：

var gulp       = require('gulp'),
    sass       = require('gulp-sass'),
    minify_css = require('gulp-minify-css'),
    notify     = require('gulp-notify'),
    autoprefix = require('gulp-autoprefixer'),
    concat     = require('gulp-concat'),
    uglify     = require('gulp-uglify'),
    rename     = require('gulp-rename');

var src = {
    sass: 'assets/sass/',
    js: 'assets/js/',
};

var output = {
    css: 'public/css/',
    js: 'public/js/',
};

gulp.task('css', function () {
    return gulp.src(src.sass + 'main.scss')
        .pipe(sass())
        .pipe(autoprefix('last 10 version'))
        .pipe(minify_css())
        .pipe(rename({basename: 'styles'}))
        .pipe(gulp.dest(output.css))
        .pipe(notify('CSS processed.'))
        .pipe(browserSync.reload({stream: true}));
});

gulp.task('js', function () {
    return gulp.src([
            src.js + 'main.js',
        ])
        .pipe(concat('app.js'))
        .pipe(uglify())
        .pipe(gulp.dest(output.js))
        .pipe(notify('JS processed.'));
});

gulp.task('watch', function () {
    browserSync.init({server: './output'});
    gulp.watch(src.sass + '**/*.scss', ['css']);
    gulp.watch(src.js + '**/*.js', ['js']);
    gulp.watch(src.js + '**/*.js', ['js']);
});

gulp.task('default', ['css', 'js', 'watch']);

有用！ 大！

我想開始在main.js編寫代碼，但是我 main.js 是弄清楚如何在我的main.js文件中require jQuery和Vue（以及其他任何功能） 。

（編輯：不一定要在main.js文件中完成，我只是希望最終結果是我可以按預期編寫代碼並將其最小化。看來我require('jquery')在gulp js任務中，但也許我做錯了。）

Answer 1

由於您僅在構建/工作流中使用節點，因此不會（希望）在應用程序代碼中調用節點的導出。 因此，簡短的答案是，但是您之前已經這樣做過。

編輯：我看到你已經用browserify標記了這個問題。 如果您嘗試使用browserify，那么您需要做的是讓gulp任務運行browserify命令，該命令將處理您的依賴項。 Node的require是另一種動物，這是您當前在gulpfile中調用的。 它用於確保您擁有所需的所有軟件包，但是您需要運行browserify以便您的應用程序代碼中的要求可以正常工作。