-1
Bootstrap'i wepback'e entegre etmeye çalışıyorum. Bunun için bootstrap-webpack kullanıyorum.Bootstrap + Webpack benim boottap sınıflarım görmezden geliyor
Bootsrap yazı tipleri doğru şekilde görünmektedir. Ancak, tüm row ve container-fluid sınıfları yok sayılır.
DOM'ı araştırdım ve bootstrap.css dosyasının bulunduğunu ve sınıfların div'lara uygulandığını onaylayabilirim. Ama neredeyse hiç etkisi yok gibi görünüyor.
Herhangi bir fikir yanlış mı?
Benim index.html:
<!DOCTYPE html>
<html>
<head lang="en">
<title>Angular with Webpack</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body ng-app="app">
<h1>Bootstrap + Webpack</h1>
<div class="row">
<div class="span10">
aaaaaaaaaaaaaaa
</div>
<div class="span2">
bbbbbbbbb
</div>
</div>
<div class="container-fluid">
<div class="row-fluid">
<div class="span2">
<h1>Sidebar content</h1>
</div>
<div class="span10">
<p>Write some text in textbox: <input type="text" ng-model="sometext" /></p>
<p>Hello {{sometext}}</p>
</div>
</div>
</div>
<script src="bundle.js"></script>
</body>
</html>
index.js dosyası:
import 'expose?$!expose?jQuery!jquery';
import angular from 'angular';
import 'bootstrap-webpack';
var ngModule = angular.module('app', []);
webpack.config.file:
module.exports = {
debug: true,
devtool: 'source-map',
context: __dirname + '/app',
entry: './index.js',
output: {
path: __dirname + '/app',
filename: 'bundle.js'
},
module: {
loaders: [
{
test: /\.js$/,
exclude: /node_modules/,
loader: "babel-loader"
},
{
test: /\.css$/,
loader: 'style-loader!css-loader'
},
{test: /\.(woff|woff2)(\?v=\d+\.\d+\.\d+)?$/, loader: 'url?limit=10000&mimetype=application/font-woff'},
{test: /\.ttf(\?v=\d+\.\d+\.\d+)?$/, loader: 'url?limit=10000&mimetype=application/octet-stream'},
{test: /\.eot(\?v=\d+\.\d+\.\d+)?$/, loader: 'file'},
{test: /\.svg(\?v=\d+\.\d+\.\d+)?$/, loader: 'url?limit=10000&mimetype=image/svg+xml'}
]
}
};