Блог

Новичок в webpack и не уверен, что я делаю или как правильно настроить конфигурацию.

Настройка:

  /
 -- /public
    -- /js
       -- app.js
    -- /css
       -- app.scss
 -- /node_modules
    -- /autoprefixer
    -- /babel-loader
    -- /babel-core
    -- /babel-preset-es2015
    -- /css-loader
    -- /node-sass
    -- /postcss-loader
    -- /sass-loader
    -- /style-loader
    -- /webpack
 -- package.json
 -- .babelrc
 -- webpack.config.js
  

webpack.config.js:

 var autoprefixer = require('autoprefixer');
var css = require('./public/css/app.scss');

module.exports = {
  entry: './public/js/app.js',
  output: {
    filename: '.public/bundle.js'
  },
  resolve: {
    extensions: ['', '.js', '.json']
  },
  module: {
    loaders: [
      {
        test: /.scss$/,
        loaders: ["style", "css", "sass"]
      },
      {
        test:   /.css$/,
        loader: "style-loader!css-loader!postcss-loader"
      },
      {
        test: /.js$/,
        exclude: /(node_modules|bower_components)/,
        loader: 'babel-loader',
        query: {
          presets: ['es2015']
        }
      }
    ]
  },
  postcss: function () {
      return [autoprefixer];
  }
};
  

При запуске «webpack» в терминале я получаю сообщение об ошибке:

 (function (exports, require, module, __filename, __dirname) { body {
                                                                   ^
SyntaxError: Unexpected token {
  

Удалите строку

 var css = require('./public/css/app.scss');
  

Вы нигде не используете css переменную, и вы не можете загружать произвольные файлы в конфигурацию вашего webpack. Загрузчики не применяются.