eleventy-plugin-sass icon indicating copy to clipboard operation
eleventy-plugin-sass copied to clipboard

Fails to refresh

Open djmtype opened this issue 4 years ago • 1 comments

It seems if I change any of the styles, the browser won't refresh even though I see the message in the terminal:

[Eleventy-Plugin-SASS] Compiling sass files... [Eleventy-Plugin-SASS] Done compiling sass files [Browsersync] Reloading Browsers...

My scss files are in the a CSS directory at the root of my project.

const pluginSass = require("eleventy-plugin-sass");
module.exports = function(eleventyConfig) {
let sassPluginOptions = {
    watch: ['**/*.{scss,sass}', '!node_modules/**'],
    sourcemaps: true
  };
eleventyConfig.addPlugin(pluginSass, sassPluginOptions);
};

I also had to disable eleventyConfig.addPassthroughCopy("css") because it was duplicating my _site directory inside the _site directory.

Tested in Chrome and Firefox -- without any browser extensions

djmtype avatar May 09 '20 23:05 djmtype

I don't know how I lost my body tag, but that's why it wasn't refreshing. Problem adverted.

However, it still remains a mystery how to set an outcome directory.

I'm having to place my scss files in the css directory, but it's collecting both scss and css files in the build directory. I tried ignoring these files in the .eleventy config file, but it didn't matter.

  let sassPluginOptions = {
    watch: ['_site/**/*.{scss,sass}', '!node_modules/**'],
    sourcemaps: true
  };

djmtype avatar May 10 '20 18:05 djmtype