Сообщение от Gozar
|
Да, было бы здорово.
|
базовый конфиг webpack.config.base.js:
/////////////////////////////////////////////////////////////////////
//// ////
//// БАЗОВЫЙ ФАЙЛ ДЛЯ СОЗДАНИЯ КОНФИГУРАЦИИ СБОРКИ ////
//// ////
/////////////////////////////////////////////////////////////////////
'use strict';
var webpack = require('webpack');
var path = require('path');
var ExtractTextPlugin = require("extract-text-webpack-plugin");
// частицы сборки конфига
var makers = {
// массив лоадеров
loaders: function (specific, common) {
var loaders = []
var add = function (loader) { loaders.push(loader) }
// общие плагин. экспорт переменных в ГО
add({test: /(react)|(react\/addons)$/, loader: 'expose?React'})
add({test: /\/jquery.js$/, loader: 'expose?jQuery'})
add({test: /\.json$/, loader: "json"})
// ES6 и JSX
add({test: /(\.jsx)|(\.js)$/, exclude: /(node_modules)|(vendor)/, loader: 'babel'})
// разметка
if (specific.html) {
add({ test: /\.html/, loader: 'html?attrs=link:href' })
}
// стили
if (common.extractText) {
add({test: /\.css$/, loader: ExtractTextPlugin.extract("style", "css!autoprefixer")})
add({test: /\.styl$/, loader: ExtractTextPlugin.extract("style", "css!autoprefixer!stylus")})
add({test: /\.less$/, loader: ExtractTextPlugin.extract("style", "css!autoprefixer!less")})
} else {
add({test: /\.css$/, loader: "style!css!autoprefixer"})
add({test: /\.styl$/, loader: "style!css!autoprefixer!stylus"})
add({test: /\.less$/, loader: "style!css!autoprefixer!less"})
}
// картинки
if (specific.images) {
add({test: /\.(png|jpg|gif)$/, loader: 'file?limit=8192'})
}
// шрифты
if (specific.fonts) {
add({test: /\.woff.?$/, exclude: /vendor/, loader: "file?limit=10000&minetype=application/font-woff" })
add({test: /fonts\/.*\.(ttf|eot|svg)(\?v=[0-9]\.[0-9]\.[0-9])?$/, exclude: /vendor/, loader: "file"})
}
if (specific.inlineSVGIcons) {
add({test: /icon-.+\.(svg)$/, exclude: /(node_modules)|(vendor)/, loader: 'raw'})
}
if (specific.kendo) {
add({test: /kendo\-ui\-core[\///].*\.js$/, loader: "imports?jQuery=jquery"})
}
return loaders
},
// массив плагинов
plugins: function (specific, common) {
var plugins = []
var add = function (plugin) { plugins.push(plugin) }
add(new webpack.NoErrorsPlugin())
if (common.extractText) {
add(new ExtractTextPlugin("[name].css"))
}
if (specific.prefetch && specific.prefetch.length) {
specific.prefetch.forEach(function (prefetchModule) {
add(new webpack.PrefetchPlugin(prefetchModule))
})
}
if (specific.hot) {
add(new webpack.HotModuleReplacementPlugin())
}
if (specific.provide) {
add(new webpack.ProvidePlugin(specific.provide))
}
if (specific.define) {
add(new webpack.DefinePlugin(specific.define))
}
return plugins
},
preLoaders: function (specific, common) {
var preLoaders = []
var add = function (preloader) { preLoaders.push(preloader) }
add({test: /\.js$/, exclude: /(node_modules)|(bootstrap.config)/, loader: "source-map"})
if (specific.globals) {
add({test: /src\/scripts\/.+(\.jsx)|(\.js)$/, exclude: /(node_modules)|(admin)\//, loader: 'imports?globals=scripts/globals.js'})
}
return preLoaders
},
}
module.exports = function makeWebpackConfig (options) {
return {
plugins: makers.plugins(options.plugins || {}, options),
output: {
pathinfo: true,
filename: '[name].js',
// publicPath: '/assets/'
},
entry: options.entry,
cache: true,
debug: true,
devtool: '#source-map',
stats: {
timings: true,
colors: true,
reasons: true
},
resolve: {
root: __dirname,
alias: options.aliases,
},
module: {
preLoaders: makers.preLoaders(options.preLoaders || {}, options),
loaders: makers.loaders(options.loaders || {}, options),
noParse: [/js\/vendor/]
},
node: {
buffer: false
}
}
}
Сборка разработки:
///////////////////////////////////////////////////////////
//// ////
//// КОНФИГУРАЦИЯ WEBPACK ДЛЯ РАЗРАБОТКИ ////
//// ////
///////////////////////////////////////////////////////////
var path = require('path');
// фабрика конфигурации
var makeConfig = require('./webpack.config.base.js');
// клиентское приложение
var client = makeConfig({
extractText: true,
entry: {
'main': [
// 'webpack/hot/only-dev-server',
'webpack/hot/dev-server',
// "bootstrap-webpack!./bootstrap.config.js",
'./js/main-webpack.js'
]
},
plugins: {
hot: true,
provide: {
'jQuery': 'jquery',
},
define: {
'global.BACKEND_HOST': '"http://localhost:8080/"',
'process.env.NODE_ENV': '"development"',
'global.SIDE': '"frontend"',
'process.env.BLUEBIRD_DEBUG': '1',
'__DEV__': 'true',
},
},
loaders: {
html: true,
images: true,
fonts: true,
}
});
module.exports = [client];
ну, для продакшена нету, но идею можно уловить