如何设置webpack来最小化和组合scss和javascript（如CodeKit）？

我在使用webpack而不是Codekit v1.9.3时遇到问题。我开始从CodeKit迁移到Grunt和Gulp，然后了解了webpack听起来很酷的内容。我似乎无法正常工作。

“像Codekit”意味着我可以：

javascript用coffeescript语法写
将所有脚本源文件和库缩小/缩小并合并为一个文件
bootstrap-sass根据需要选择性地包含（scss）框架的组件
通过sass变量使用引导程序自定义来维护一个小文件，例如 $brand-primary
用于webpack --watch在更改脚本和样式时自动对其进行编译
最后得到一个CSS文件和一个脚本文件，这些文件可以包含在样式表和脚本标签中。

Codekit项目设置

Bower资源：

我目前将这些存储在项目外部的全球范围内：

~/bower_components/twbs-bootstrap-sass/vendor/assets/stylesheets

因为CodeKit支持指南针，所以我在config.rb文件中输入了以下内容：

add_import_path "~/bower_components/twbs-bootstrap-sass/vendor/assets/stylesheets"

项目结构

js/fancybox.js
js/main.js               <-- currently the compiled js 'output' file
js/main.coffee

css/styles.css           <-- currently the compiled css 'output' file

scss/styles.scss
scss/modules/_bootstrap-customizations.scss
scss/modules/_typography.scss
scss/partials/_header.scss
scss/partials/_footer.scss

styles.scss的内容

@import "modules/bootstrap-customizations";  # local customizations
@import "bootstrap/variables";
@import "bootstrap/mixins";
...                                          # load bootstrap files as required
@import "bootstrap/wells";

系统设置：

系统：OS X 10.9
节点-v0.10.32
npm-v2.1.7
zsh-zsh 5.0.7（x86_64-apple-darwin13.4.0）

节点安装了自制软件brew install node，否则似乎工作正常。

我尝试过的

我已阅读以下页面：

我已经尝试webpack.config.js多次创建文件，最近的尝试是此文件的多个版本：

module.exports = {
    entry: [
    "./node_modules/bootstrap-sass-webpack!./bootstrap-sass.config.js",
    "./js/main.coffee"
    ],
    output: {
        path: __dirname,
        filename: "main.js"
    },
    module: {
        loaders: [
        { test: /\.css$/, loader: "style!css" }
        ]
    }
};

Webpack错误

运行时，webpack我得到以下信息：

ERROR in ./~/bootstrap-sass-webpack/~/css-loader!/Users/cwd/~/sass-loader!./~/bootstrap-sass-webpack/bootstrap-sass-styles.loader.js!./bootstrap-sass.config.js
stdin:1: file to import not found or unreadable: "~bootstrap-sass/assets/stylesheets/bootstrap/variables

NPM错误

I get an error when attempting to npm install bootstrap-sass, and not had any luck when searching for a solution. I'm not even sure I need this module.

npm ERR! Darwin 13.4.0
npm ERR! argv "node" "/usr/local/bin/npm" "install" "bootstrap-sass"
npm ERR! node v0.10.32
npm ERR! npm  v2.1.7
npm ERR! code EPEERINVALID

npm ERR! peerinvalid The package bootstrap-sass does not satisfy its siblings' peerDependencies requirements!
npm ERR! peerinvalid Peer bootstrap-sass-webpack@0.0.3 wants bootstrap-sass@~3.2.0

npm ERR! Please include the following file with any support request:
npm ERR!     /Users/cwd/webpack-test/npm-debug.log

Sources of Confusion

The most confusing parts of webpack for me are:

Where should things like require("bootstrap-sass-webpack") be added - is it in the webpack.config.js file, or in the js/main.js file?
Should modules like this available to webpack as soon as they are installed with npm install ?
I thought that I should do npm install webpack -g so that webpack was installed globally, and use npm install without the -g for the other modules. However, I don't see any node_modules folder being created in my project. Shouldn't there be one?
How are the search paths determined / specified for things like require("bootstrap-sass-webpack") ?

我应该安装哪些节点模块才能执行此操作？我应该webpack.config.js长什么样？