Question

到目前为止，BrowserSync的一切正常，但我加载jpg文件时遇到了一个愚蠢的问题。 Chrome控制台中出现错误＆＃34;不允许加载本地资源＆＃34;在gulp watch自动启动页面后，一切正常，但我无法在页面上看到我的背景图片。图像位于我项目的文件夹中。当我打开页面（双击index.html）而没有gulp watch任务时，我不会遇到这样的问题。

这是我的gulpfile.js：

var gulp = require("gulp");

var watch = require("gulp-watch");
postcss = require("gulp-postcss");
autoprefixer = require("autoprefixer");
cssvars = require("postcss-simple-vars");
nested = require("postcss-nested");
cssImport = require("postcss-import");
browserSync = require("browser-sync").create();

gulp.task('default', function() {
    console.log("yeeey!");
});

gulp.task("html", function() {
    console.log("html task");
});

gulp.task("styles", function() {
    return gulp.src("./app/assets/styles/styles.css")
        .pipe(postcss([cssImport, cssvars, nested, autoprefixer]))
        .pipe(gulp.dest("./app/temp/styles"));
});

gulp.task("watch", function() {

    browserSync.init({
        server: {
            baseDir: "app"
        }
    });

    watch("./app/index.html", function() {
        gulp.start("html");
    });
    watch("./app/assets/styles/**/*.css", function() {
        gulp.start("styles");
    });
});

这就是我在index.html

中导航到图片的方式

<img src="C:/Users/aa/Desktop/Web-dev-course/Projects/travel-site/app/assets/images/Wietnam/v111.jpg">

感谢您的帮助！

安

错误：Chrome - 不允许加载本地资源

0 个答案: