vigetlabs/blendid

Compilation not occurring upon change in html sub directory

jakefleming opened this issue · 9 comments

I've got a sub directory: "src/html/apps/"

When a change is made in the html file within the "apps" directory, browsersync acts like it detected the change and refreshes, but the changes have not actually been compiled and built.

For example, if I change some text from "foo" to "bar" the page will refresh like the change was detected...so you'd expect to now see "bar" where "foo" used to be, but "foo" is still there. The changes are not reflected.

Changes at the root level of the html folder still work as expected.

Happy to provide more information!

screen shot 2018-02-15 at 11 30 26 am

Did you ever figure out the issue?

olets commented

Sorry for keeping you waiting so so long @jakefleming!

@xavianaxw are you having this problem as well?

@olets yeah it happens for my stylesheets as well

olets commented

@xavianaxw html and stylesheets, that sounds like some bigger problem. Might deserve its own issue but for now:

  • What version of Blendid are you on?
  • What exactly are you seeing with stylesheets?
  • Mind posting your task-config and path-config?
"blendid": "^4.5.0",
module.exports = {
  html        : true,
  images      : true,
  fonts       : true,
  static      : true,
  svgSprite   : true,
  ghPages     : true,

  stylesheets : {
    autoprefixer: {
      browsers: ['ie 11', 'last 3 versions'],
    },
  },

  javascripts: {
    entry: {
      // files paths are relative to
      // javascripts.dest in path-config.json
      app: ["@babel/polyfill", "./app.js"],
      "app-styleguide": ["@babel/polyfill", "./app-styleguide.js"],
    },
    babelLoader: {
      // "test" is derived from TASK_CONFIG.javascripts.extensions
      // "options" is derived from TASK_CONFIG.javascripts.babel
      loader: "babel-loader",
      exclude: /node_modules\/(?!(dom7|swiper)\/).*/,
    },
    alias: {
      PlyrDefaults: "plyr/src/js/config/defaults.js",
      PlyrPolyfilled: "plyr/dist/plyr.polyfilled.min.js",
    },
  },

  browserSync: {
    server: {
      // should match `dest` in
      // path-config.json
      baseDir: 'public'
    }
  },

  production: {
    rev: true
  }
}

task-config.js

{
  "src": "./src",
  "dest": "./public",

  "html": {
    "src": "html",
    "dest": "./"
  },

  "static": {
    "src": "static",
    "dest": "./"
  },

  "javascripts": {
    "src": "javascripts",
    "dest": "javascripts"
  },

  "stylesheets": {
    "src": "stylesheets",
    "dest": "stylesheets"
  },

  "images": {
    "src": "images",
    "dest": "images"
  },

  "fonts": {
    "src": "fonts",
    "dest": "fonts"
  },

  "icons": {
    "src": "icons",
    "dest": "images"
  }
}

path-config.json

The stylesheet gets updated once in a while. Sometimes it just gets skipped. Not too sure how to replicate this though

Saving app.scss does however trigger an update to the stylesheet though

Did you ever figure out the issue?

Sorry, this was so long ago that I have no idea if this still happens in whatever project I was trying to use it on! Good luck @xavianaxw

olets commented

Thanks for the info @xavianaxw. I haven't dug in yet. Is it possible this is tied to #561?

I think it's not a similar case but from what is stated on #561 browser sync could be acting up or something.