Как использовать Webpack для Bootstrap?

Question

Я использую веб-пакет для объединения некоторых файлов Boostrap и других CSS-файлов в один. Ниже приведен файл webpack.config.js var htmlWebPack = require('html-webpack-plugin'); var ExtractTextPlugin = require("extract-text-webpack-plugin");

module.exports = {
    entry: "./app/main.ts",
    output: {
        path: __dirname + '/dist',
        filename: "bundle.js"
    },
    resolve: {   
    extensions: ['.js','.ts']
  },
    module: {
        loaders: [
          {
              test: /\.tsx?$/,
              loader: 'awesome-typescript-loader'
          },
          {
        test: /\.css$/,
        use: ExtractTextPlugin.extract({
          fallback: "style-loader",
          use: "css-loader"
        })
      },
      {
             test: /\.(png|woff|woff2|eot|ttf|svg)(\?v=[0-9]\.[0-9]\.[0-9])?$/,
           loader: 'url-loader' }
        ]
    },
    plugins: [
    new htmlWebPack({
        template: './index.html',

    }),
      new ExtractTextPlugin("minified-style.css"),
    ]

};

и я ссылался на мою папку начальной загрузки в файле main.ts, как это

require('../Content/bootstrap/bootstrap.min.css');
require('../Content/bootstrap/bootstrap-theme.min.css');

но когда я запускаю веб-пакет, я получаю сообщение об ошибке примерно так

D:\ Проект \angularControls\angularControls\node_modules\ погрузчиком бегуна \ Lib \ loadLoader.js: 35

throw new Error ("Module '" + loader.path + "' не является загрузчиком (должен иметь функцию normal или pitch)");

^ Ошибка: Модуль 'D:\project\angularControls\angularControls\node_modules\url\url.js'

не является загрузчиком (должен иметь нормальную или питч-функцию)

не уверен, что происходит не так.

Answer 1

Webpack прошел большой путь с точки зрения гибкости и мощности. Хотя у меня был тот же вопрос некоторое время назад, мне не потребовалось много времени, чтобы настроить модуль для использования начальной загрузки с веб-пакетом. Не стесняйтесь посетить код в GitHub Repo.

Надеюсь, это поможет кому-то.