不能得到 - 404错误，当我修改我的HTML文件，浏览器被重新加载

Z时代
2024-01-10
分类：问答

我为我提供浏览器同步应用在gulpfile.js。不能得到 - 404错误，当我修改我的HTML文件，浏览器被重新加载

当我编辑HTML文件，当浏览器被重新加载，它说

不能得到/找到

或任何网址是我正在查看的页面。

如果我为我的应用程序与npm run lite它没有这个问题。为什么我会遇到这个问题？

gulpfile.js：

var gulp = require("gulp"); 
var sass = require("gulp-sass"); 
var sourceMaps = require("gulp-sourcemaps"); 
var del = require("del"); 
var typescript = require("gulp-typescript"); 
var tslint = require("gulp-tslint"); 
var browserSync = require("browser-sync"); 
gulp.task("serveApp", ["build"], function() { 
    browserSync.init({ 
     server: { 
     baseDir: "./", 
     }, 
    }); 
}); 
gulp.task("compileTypescript", ["clean"], function() { 
    return gulp.src("src/**/*.ts") 
     .pipe(sourceMaps.init()) 
     .pipe(typescript({ 
     "emitDecoratorMetadata": true, 
     "experimentalDecorators": true, 
     "lib": ["es2015", "dom"], 
     "module": "system", 
     "moduleResolution": "node", 
     "noImplicitAny": true, 
     "outDir": "dist/", 
     "removeComments": false, 
     "sourceMap": true, 
     "target": "es5", 
     "typeRoots": [ 
      "./node_modules/@types", 
     ], 
     })) 
     .pipe(sourceMaps.write("./")) 
     .pipe(gulp.dest("dist/")); 
}); 
gulp.task("compileSass",() => { 
    gulp.src("src/**/*.scss") 
     .pipe(sourceMaps.init()) 
     .pipe(sass().on("error", sass.logError)) 
     .pipe(sourceMaps.write("./")) 
     .pipe(gulp.dest("./src")); 
}); 
gulp.task("watchSass", function() { 
    gulp.watch("src/**/*.scss", ["compileSass", "reloadAfterSassChanged"]); 
}); 
gulp.task("watchTypescript", function() { 
    gulp.watch("src/**/*.ts", ["compileTypescript", "reloadAfterTypescriptChanged"]); 
}); 
gulp.task("watchHtml", function() { 
    gulp.watch("src/**/*.html", ["reloadAfterHtmlChanged"]); 
}); 
gulp.task("reloadAfterSassChanged", ["compileSass"], function(done) { 
    browserSync.reload(); 
    done(); 
}); 
gulp.task("reloadAfterHtmlChanged", function() { 
    browserSync.reload(); 
}); 
gulp.task("reloadAfterTypescriptChanged", ["compileTypescript"], function(done) { 
    browserSync.reload(); 
    done(); 
}); 
gulp.task("clean",() => { 
    return del("dist"); 
}); 
gulp.task("build", ["watchTypescript", "watchSass", "watchHtml"]); 
gulp.task("default", ["serveApp"]);

注意到我所服务的运行gulp它运行默认任务应用程序。

回答：

This answer worked，但它是在旧版本的角2使用的，所以我不得不使用它像这样（加的app.module.ts提供商场）：

app.module.ts

import { HashLocationStrategy, Location, LocationStrategy } from "@angular/common"; 
@NgModule({ 
    bootstrap: [AppComponent], 
    declarations: [ 
     AppComponent, 
    ], 
    imports: [ 
     BrowserModule, 
     RouterModule.forRoot(routerConfig), 
     LandingPageModule... 
    ], 
    providers: [ 
     FormBuilder, 
     Location, { provide: LocationStrategy, useClass: HashLocationStrategy }, 
    ], 
})