var path = require('path');

module.exports = {
  name: 'app',

  // ngụ ý rằng môi trường chúng ta hướng tới là browser, webpack cũng có thể dùng làm build tool cho node. Cơ mà theo tôi thì có lẽ hơi thừa.
  target: 'web',

  // điểm bắt đầu để import module, bạn có thể định nghĩa nhiều điểm bắt đầu.
  entry: {
    app: [
      './src/index.js',

      // thêm đoạn script này để webpack-dev-server có thể hoạt động. Khi triển khai có thể bỏ nó đi.
      'webpack-dev-server/client?http://localhost:8080',
    ],
  },

  // thư mục ra
  output: {
    path: path.resolve(__dirname, './dist'),

    // ví dụ ở trên entry của tôi là app thì file ra sẽ là app.bundle.js
    filename: '[name].bundle.js',
  },

  devServer: {
    contentBase: './dist',
  },

  // phần này config các loader theo từng loại file.
  module: {

    loaders: [
      {
        test: /\.css$/,
        loader: 'style!css',
      },
      {
        // đúng thế, ES6 module sẽ được babel transform nhờ cấu hình này
        test: /\.js$/,
        loader: 'babel?optional[]=runtime',
        exclude: /node_modules/,
      },
      {
        // các file ảnh ọt và font được copy sang thư mục đích. Tôi lần mò mãi mới đưa được font-awesome lên hình.
        test: /\.(png|jpg|jpeg|gif|svg|woff|woff2|ttf|eot)(\?v=\d+\.\d+\.\d+)?$/,
        loader: 'file',
      }, {
        // copy nội dung file template vào code js.
        test: /\.tpl.html$/,
        loader: 'raw',
      }, {
        // file index.html, chỉ đơn giản là copy và giữ nguyên tên.
        test: /index.html$/,
        loader: 'file?name=[name].[ext]',
      }, {
        // loader cho file sass
        test: /\.scss$/,
        loader: 'style!css!sass',
      }, {
        // tôi thêm dòng này để dịch file .sass nếu các bạn thích.
        test: /\.sass$/,
        loader: 'style!css!sass?indentedSyntax',
      },
    ],
  },

};

// index.js
import './index.html';
import app from './app/app.module.js';

// ví dụ dùng angular chẳng hạn
import {bootstrap} from 'angular';

bootstrap(document, [app]);

// karma.config.js

module.exports = function(config) {
  config.set({

    basePath: '',

    frameworks: ['mocha', 'chai'],

    // sử dụng một file giống như là file entry của webpack để import các file spec.
    files: [
      'bundle.spec.js',
    ],

    exclude: [],

    preprocessors: {
      'bundle.spec.js': ['webpack', 'sourcemap'],
    },

    // tương tự như file cấu hình webpack
    webpack: {
      module: {
        loaders: [
          {
            test: /\.css$/,
            loader: 'style!css',
          },
          {
            test: /\.js$/,
            loader: 'babel?optional[]=runtime',
            exclude: /node_modules/,
          },
          {
            test: /\.(png|jpg|jpeg|gif|svg|woff|woff2|ttf|eot)(\?v=\d+\.\d+\.\d+)?$/,
            loader: 'file',
          }, {
            test: /\.tpl.html$/,
            loader: 'raw',
          }, {
            test: /index.html$/,
            loader: 'file?name=[name].[ext]',
          }, {
            test: /\.scss$/,
            loader: 'style!css!sass',
          },
        ],

        preLoaders: [
          {
            test: /\.js$/,
            exclude: /(node_modules\/|\.spec.js$)/,
            loader: 'isparta-instrumenter',
          },
        ],
      },
    },

    webpackServer: {
      noInfo: true,
    },

    reporters: ['mocha'],

    port: 9876,

    colors: true,

    logLevel: config.LOG_INFO,

    autoWatch: true,

    browsers: ['PhantomJS'],

    singleRun: false,

    plugins: [
      'karma-webpack',
      'karma-mocha',
      'karma-mocha-reporter',
      'karma-chai',
      'karma-phantomjs-launcher',
      'karma-sourcemap-loader',
    ],
  });
};

// dummy.spec.js
describe('Dummy', () => {
  let a;
  let b = 2;

  beforeEach(() => {
    a = b;
  });

  it('should do abc', () => {
    expect(a).to.equal(b);
    expect(true).to.not.be.false;
  });

});