Question

我通过浏览器同步代理网站并注入css / js，这样一来，我就可以在托管环境中使用zurb基础和sass，因为我已经访问了HTML文件/ SSH，因此它们已经全部构建在基于浏览器的编辑器中。所以我必须代理它，注入样式和js。然后，全部完成后上传。但是由于某种原因，我似乎无法使Sourcemaps与我的设置一起使用。多了一对眼睛。

文件夹层次结构：

+ assets (css + js in here)
+ node_modules
+ scss (scss in here)

这是我的gulpfile：

const gulp          = require('gulp');
const sass          = require('gulp-sass');
const autoprefixer  = require('gulp-autoprefixer');
const sourcemaps    = require('gulp-sourcemaps');
const browserSync   = require('browser-sync').create();
function style(){
    return gulp.src('./scss/**/*.scss')
    // sourcemaps
        .pipe( sourcemaps.init( { loadMaps: true, largeFile: true } ) )
        .pipe( sass({ 
                includePaths: ['./node_modules/foundation-sites/scss'],
                noCache: true,
                sourceMap: true,
                errLogToConsole: true
            })
        ).on('error', sass.logError )
        .pipe( autoprefixer({ browsers: ['last 2 versions', 'ie >= 8', 'android >= 4.4', 'ios >= 7'] }) )
        .pipe( sourcemaps.write( './' ) )
        .pipe( gulp.dest( './assets' ) )
        .pipe( browserSync.stream() );
}
function watch(){
    browserSync.init({
        plugins: ['bs-console-qrcode'],
        open: false,
        proxy: "https://somedomain.com/",
        files: ['assets/**'],
        serveStatic: ["assets/"],
        rewriteRules: [
            {
                match: new RegExp('somedir/inject.css'),
                fn: function() {
                  return '/addMe.css';
                }
            }
        ],
        snippetOptions: {
            rule: {
                match: /<\/body>/i,
                fn: function (snippet, match) {
                    return '<script src="/js/vendor/what-input.js"></script>' + 
                    '<script src="/js/vendor/foundation.min.js"></script>' + 
                    '<script type="text/javascript" src="/addMe.js" ></script>' + snippet + match;
                }
            }
        }
    });
    gulp.watch( './scss/**/*.scss', style );
    gulp.watch( './assets/**.js' ).on( 'change', browserSync.reload );
}

exports.style = style;
exports.watch = watch;

有什么想法吗？

无法生成sass gulp源图

0 个答案: