Endless build loop with `fix` option about stylelint-webpack-plugin

[renarsvilnis]

@JaKXz I'll look into how webpack plugins work and try to understand what's going into the plugin and what's coming out. But the best result probably is to begin a discussion on stylelint.

[dkrnl]

I catch similar bug, temporary solution:

const DEV_SERVER = path.basename(require.main.filename) === 'webpack-dev-server.js';
...
new StyleLintPlugin({
    fix: !DEV_SERVER,
}),

[JaKXz]

@renarsvilnis thanks for reporting this. I think it should be discussed upstream in stylelint to see how non-correctable errors should be handled, but perhaps this plugin should also be able to detect this kind of infinite loop...

I'm not sure where to start yet, and don't have the cycles to investigate ATM, so if you think you can put in a failing test then that would be a great start!

[benjixx]

@renarsvilnis Have you found a solution or workaround to this problem?

[benjixx]

Enabling the caching for stylelint seems to improve the situation a lot, although not all build loops are gone, e.g. when I add a blank line at the end of a CSS rule block I still run into a build loop.

[calledT]

I've create a repo to show this issue.
After npm install and exec npm start, it will run into endless status.

[ypconstante]

Any follow up in this behavior? In my situation, the loop happens even if there is no error in the file.

[JaKXz]

I would accept a PR that adds @dkrnl's workaround as the default for the fix option, i.e.

options = assign({
  fix: path.basename(require.main.filename) !== 'webpack-dev-server.js',
  ...
})

but I'm not a fan of that as a complete solution [yet]. Any deeper investigation is welcomed!

[JonJamesDesign]

Also having this problem with webpack when using the webpack --watch command.

Here's my setup:

/package.json

{
  "name": "LintTest",
  "version": "1.0.0",
  "main": "index.js",
  "scripts": {
    "build": "webpack -p",
    "watch": "webpack --watch"
  },
  "devDependencies": {
    "babel-core": "^6.26.0",
    "babel-loader": "^7.1.2",
    "babel-preset-env": "^1.6.1",
    "css-loader": "^0.28.8",
    "extract-text-webpack-plugin": "^3.0.2",
    "node-sass": "^4.7.2",
    "postcss-loader": "^2.0.10",
    "sass-loader": "^6.0.6",
    "stylelint": "^8.4.0",
    "stylelint-webpack-plugin": "^0.9.0",
    "webpack": "^3.10.0"
  },
  "browserslists": [">= 1%", "last 20 versions"]
}

/webpack.config.js:

const path = require("path");
const ExtractTextPlugin = require("extract-text-webpack-plugin");
const StyleLintPlugin = require("stylelint-webpack-plugin");

const config = {
  entry: ["./src/js/index.js", "./src/css/main.scss"],
  output: {
    path: path.resolve(__dirname, "public"),
    filename: "js/bundle.js"
  },
  module: {
    rules: [
      {
        test: /\.js$/,
        use: "babel-loader"
      },
      {
        test: /\.scss$/,
        loader: ExtractTextPlugin.extract([
          "css-loader",
          "postcss-loader",
          "sass-loader"
        ])
      }
    ]
  },
  plugins: [
    new ExtractTextPlugin({
      filename: "css/styles.css",
      allChunks: true
    }),
    new StyleLintPlugin({
      configFile: ".stylelintrc",
      files: "src/**/*.scss",
      syntax: "scss",
      fix: true
    })
  ]
};

module.exports = config;

/.stylelintrc:

{
  "rules": {
    "indentation": 2,
    "string-quotes": "single",
    "color-hex-case": "lower",
    "color-hex-length": "short",
    "selector-no-qualifying-type": true,
    "selector-combinator-space-after": "always",
    "selector-attribute-quotes": "always",
    "selector-attribute-operator-space-before": "never",
    "selector-attribute-operator-space-after": "never",
    "selector-attribute-brackets-space-inside": "never",
    "declaration-block-trailing-semicolon": "always",
    "declaration-colon-space-before": "never",
    "declaration-colon-space-after": "always",
    "property-no-vendor-prefix": true,
    "value-no-vendor-prefix": true,
    "number-leading-zero": "always",
    "function-url-quotes": "always",
    "font-family-name-quotes": "always-where-required",
    "comment-whitespace-inside": "always",
    "at-rule-no-vendor-prefix": true,
    "selector-pseudo-element-colon-notation": "double",
    "selector-no-vendor-prefix": true,
    "media-feature-range-operator-space-before": "always",
    "media-feature-range-operator-space-after": "always",
    "media-feature-parentheses-space-inside": "never",
    "media-feature-name-no-vendor-prefix": true,
    "media-feature-colon-space-before": "never",
    "media-feature-colon-space-after": "always"
  }
}

[jonny-harte]

Hi, is there any progress on this? the fix fix: path.basename(require.main.filename) !== 'webpack-dev-server.js', doesn't work for me

[calledT]

This issus may due to Files created right before watching starts make watching go into a loop, after add time-fix-plugin, it work well with fix: true config.

[ricardogobbosouza]

Upgrade to latest version, if problem persists reopen this