Как сохранить несжатый файл - понятно
// [url]https://github.com/gulpjs/gulp/blob/master/docs/README.md[/url]
var gulp = require('gulp');
// [url]http://webpack.github.io/docs/[/url]
var webpack = require('webpack');
// [url]https://github.com/shama/webpack-stream[/url]
var webpackStream = require('webpack-stream');
gulp.task(
'task/build',
function() {
return gulp
.src('./src/index.js')
.pipe(webpackStream({
devtool: 'source-map',
debug: true,
output: {
filename: 'module.js'
}
}))
.pipe(gulp.dest('./dist'));
}
);
Как минимицировать тоже ясно:
gulp.task(
'task/build',
function() {
return gulp
.src('./src/index.js')
.pipe(webpackStream({
plugins: [
// [url]http://webpack.github.io/docs/list-of-plugins.html#uglifyjsplugin[/url]
new webpack.optimize.UglifyJsPlugin({
compress: {
warnings: false
}
})
],
devtool: 'source-map',
debug: true,
output: {
filename: 'module.min.js'
}
}))
.pipe(gulp.dest('./dist'));
}
);
А вот как сохранить и то и другое и описать это в одном конфиге? |
Нашел похожий вопрос на стеке: How to build minified and uncompressed bundle with webpack?
Ответы сводятся к Цитата:
В примерах веб-пака нашел multi-compiler. Т.о. в идеале конфиг будет выглядеть примерно так:
gulp.task(
pkg.name + '/build',
function() {
var MODULE = {
loaders: [
// [url]https://github.com/babel/babel-loader[/url]
{test: /\.js$/, loader: 'babel'},
// [url]https://github.com/webpack/json-loader[/url]
{test: /\.json$/, loader: 'json'},
// [url]https://github.com/webpack/html-loader[/url]
{test: /\.html$/, loader: 'html'}
]
};
// [url]http://webpack.github.io/docs/list-of-plugins.html#uglifyjsplugin[/url]
var UGLIFY = new webpack.optimize.UglifyJsPlugin({
compress: {
warnings: false
}
});
// [url]http://webpack.github.io/docs/list-of-plugins.html#bannerplugin[/url]
var BANNER = new webpack.BannerPlugin(
'/*\n' +
' ' + pkg.name + ' v' + pkg.version + '\n' +
' ' + pkg.homepage + '\n' +
'*/\n'
,
{
entryOnly: true,
raw: true
}
);
return gulp
.src('./src/index.js')
.pipe(webpackStream(
[
// full
{
module: MODULE,
plugins: [BANNER],
devtool: 'source-map',
output: {
library: pkg.name,
libraryTarget: 'umd',
filename: pkg.name + '.js'
}
},
// min
{
module: MODULE,
plugins: [UGLIFY, BANNER],
devtool: 'source-map',
output: {
library: pkg.name,
libraryTarget: 'umd',
filename: pkg.name + '.min.js'
}
}
]
))
.pipe(gulp.dest('./dist'));
}
);
Проблема в том, что webpackStream не поддерживает array of options :) Посмотрим, что ответит создатель плагина. |
У кого есть время и желание написать патч для webpack-stream? :)
https://github.com/shama/webpack-stream/issues/78 |
//новый адепт вкатился в трэд)
Чуваки, вы вебпаком собираете бэкэнд, так? Если да, то точно так же как и фронтэнд, всё собираете в один бандл или что-то другое придумали? |
Есть конфиг для вебпака и dev cервера (один конфиг) запускаю dev сервер с тем конфигом
output у меня на две дериктории выше ../../scripts-dist (для дев сервера как корень установил директорию в которой scripts-dist) и когда пробую получу скрипт по адресу localhost: port/script-dist/ то он отдает статику а не из память, как это решить?
context: __dirname,
entry: getEntries(),
output: {
filename: distDir
},
resolve: {
root: path.resolve('./'),
modulesDirectories: getModulesDirectories(),
}
|
Обычная мультикомпиляция не подойдёт?
|
Илья Кантор, нет, архитектура изначально была по индуски сделана и менять сейчас времени нет.
Так получилось что часть проекта собирается чезер один конфиг, ачасть через другой. Там библиотеки собираются отдельно а все остальное отдельно |
Новый адепт вкатился в трэд [2]
Хочу попробовать вебпак на боевом проекте, и для этого сначала пытаюсь решить такую задачку: ![]() При дефолтных настройках build layers выглядят примерно как XA, YAB, ZA. А я хочу - XA, YA, Z, B. Чтобы модуль B соответсвенно грузился on-demand, и только один раз, если мы запросим x и y. Вроде доки говорят что для этого CommonsChunkPlugin, но что-то у меня не получается правильно его использовать. Например я могу сказать так:
module.exports = {
entry: {
main: "./main",
BBuilded: ["B"]
},
resolve: {
modulesDirectories: [
"."
]
},
output: {
publicPath: "js/",
filename: "[name].builded.js"
},
plugins: [
new CommonsPlugin({
async: true,
children: true,
chunkNames: 'B'
})
]
};
B он вычленит, но из верних слоев не исключит. Или могу сказать "пройдись по поддереву и выдели общее у всех потомков", но что делать в случае сложнее чет непонятно( |
Как описать в одном конфиге сжатую и несжатую версии?
Очень часто мне приходится использовать вебпак для сборок модулей/компонентов (npm/bower). Ранее приходилось описывать два конфига сжатойй и несжатой версий. Оказывается, можно сделать в одном.
Тот же самый вопрос, заданный мною ранее http://javascript.ru/forum/showthrea...926#post390986 |
| Часовой пояс GMT +3, время: 07:57. |