Как убрать смещение страницы влево при появлении полосы прокрутки?

Я зарегался ради твоего ответа) Спасибо тебе большое. Уже конечно 3 года прошло)) но я всё равно не поленюсь поблагодарить) Чувак реально рабочую версию написал, а вокруг глазами хлопают.

Angular + Webpack + SCSS + Autoprefixer?

В общем методами тыка у меня получилось устранить почти все ошибки и баги.
Все собирается в один js, глобальные стили работают, все хорошо кроме руганий вебпака на core.js
Но главное, что не мешает, все робит

Пример моего файла, может кому пригодится

const path = require('path');
const webpack = require('webpack');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const autoprefixer = require('autoprefixer');

module.exports = {
  entry: {
    'main': [
      './src/styles.scss',
      './src/polyfills.ts',
      './src/main.ts',
    ]
  },
  mode: "development",
  // mode: "production",
  output: {
    path: path.resolve(__dirname, 'dist'),     // путь к каталогу выходных файлов - папка dist
    publicPath: '/WWW/static/dist',
    // filename: '[name].[hash].js'
    filename: '[name].js'
  },
  devServer: {
    compress: true,
    port: 9000,
    watchContentBase: true,
    progress: true,
    historyApiFallback: true,
  },
  resolve: {
    extensions: ['.ts', '.js', '.json', '.css', '.scss', '.html']
  },
  module: {
    rules: [
      {
        test: /\.ts$/,
        use: [
          {
            loader: 'awesome-typescript-loader',
            options: {configFileName: path.resolve(__dirname, 'tsconfig.json')}
          },
          'angular2-template-loader'
        ]
      },
      {
        test: /\.html$/,
        loader: 'html-loader'
      },
      {
        test: /\.(png|jpe?g|gif|svg|woff|woff2|ttf|eot|ico)$/,
        loader: 'file-loader?name=assets/[name].[ext]'
      },
      {
        test: /\.(css|sass|scss)$/,
        use: [
          {loader: 'to-string-loader'},
          {loader: 'style-loader'},
          {loader: 'css-loader'},
          {
            loader: 'postcss-loader',
            options: {
              plugins: [
                autoprefixer({
                  browsers: ['ie >= 8', 'last 4 version']
                })
              ],
              sourceMap: true
            }
          },
          {loader: 'sass-loader'}
        ]
      }
    ]
  },
  plugins: [
    new webpack.ContextReplacementPlugin(
      /angular(\|\/)core/,
      path.resolve(__dirname, 'src'), // каталог с исходными файлами
      {} // карта маршрутов
    ),
    new HtmlWebpackPlugin({
      template: 'src/index.html'
    }),
    new webpack.NoEmitOnErrorsPlugin(),
    new webpack.LoaderOptionsPlugin({
      htmlLoader: {
        minimize: false
      }
    }),
  ]
};

Angular + Webpack + SCSS + Autoprefixer?

Огромное спасибо) Поковырялся, блок для стилей стал такой

{
        test: /\.(css|sass|scss)$/,
        exclude: path.resolve(__dirname, 'src/app'),
        use: [
          {
            loader: 'css-loader',
            options: {
              minimize: true,
              sourceMap: true
            }
          },
        ]
      },
      {
        test: /\.(css|sass|scss)$/,
        use: [
          {
            loader: 'postcss-loader',
            options: {
              plugins: [
                autoprefixer({
                  browsers: ['ie >= 8', 'last 4 version']
                })
              ],
              sourceMap: true
            }
          },
          {loader: 'sass-loader'}
        ]
      }

Собирает как надо, стили работают. Префиксы работают. Еще raw пришлось убрать, с ним не запускался сервер.
НО за исключением глобального style.scss, который вроде как глобальный для всего в ангуляре. От него стили не подключаются
Этого не подскажите?)

Gulp scss почему ошибка при компиляции с вложенными элементами?

спасибо огромное! Вот при огромное спасибо!!!)!)