0

所以我让 IIS使用主机文件中的别名在端口 80 上提供我的WebApiAngularJS项目。mywebsite.local-dev.com

我有用于捆绑的 webpack 配置设置,我现在要做的就是将 webpack 开发服务器放在顶部,这样当我修改文件时,它会重新捆绑所有内容并更新浏览器。

browser-sync几乎工作了,但require('./somehtmltemplate.html')似乎引起了问题。这是一个Angular应用程序,所以我在 ui-router 模板属性中使用了 require。这是我的 gulpfile:

var gulp = require('gulp'),
    browserSync = require('browser-sync').create(),
    watch = require('gulp-watch'),
    webpack = require('webpack'),
    webpackconfig = require('./webpack.config');

gulp.task("webpack", function(callback) {
    // run webpack
    webpack(
      webpackconfig,
      function(err, stats) {
        if(err) throw new gutil.PluginError("webpack", err);

        callback();
      }
    );
});

gulp.task('watch', function() {
    browserSync.init({
        proxy: "mywebsite.local-dev.com"
    });

    gulp.watch("App/**/*.js", ['webpack']).on('change', browserSync.reload);
    gulp.watch("App/**/*.html", ['webpack']).on('change', browserSync.reload);
});

我的问题是,我如何让任何一个工作。

编辑

因为我在用.cshtml我不能用webpack-dev-server。所以问题是,我怎样才能让 gulp 工作?

4

1 回答 1

2

我通过在代理上使用 webpack-dev-middleware 和 webpack-hot-middleware 作为中间件时让 Browsersync 代理我的外部服务器(在我的情况下是 MAMP,但这不重要)解决了类似的问题。通过该设置,您可以让您的普通服务器负责为您的应用程序提供服务,而 Browsersync+Webpack 将只处理资产捆绑和服务,以及浏览器注入和重新加载。

如果您有兴趣,这是一个工作示例:github.com/shanecav/webpack-browsersync-proxy

于 2015-08-27T09:36:19.440 回答