Добрый день!
Прошу помочь!
Что имеется:
Существует вложенная иерархия папок. В dev/views/ лежат файлы, которые после компилиции переносятся в prod/compiled/
Проблема в том, что вложенный head после компиляции выносится как отдельная папка(да, потому что точка входа указана отдельно). А я хочу чтобы после сборки проекта, сохранялась иерархия папок.
Для webpack'a точкой входа являются файлы с расширение *.js в него же подключается рядом лежащий pcss(который после postcss становится css).
Весь webpack.config.js
const path = require('path');
const webpack = require('webpack');
const merge = require('webpack-merge');
const ExtractTextPlugin = require("extract-text-webpack-plugin");
const precss = require('precss');
const autoprefixer = require('autoprefixer');
const AssetsPlugin = require('assets-webpack-plugin');
const js = require('./webpack/rules.js');
const cssBottom = require('./webpack/rules.plugin.css.bottom');
const cssTop = require('./webpack/rules.plugin.css.top');
const cssBottomHash = require('./webpack/rules.plugin.css.bottom.hash');
const cssTopHash = require('./webpack/rules.plugin.css.top.hash');
const images = require('./webpack/plugin.images');
const uglifyJs = require('./webpack/plugin.uglify');
const define = require('./webpack/plugin.define');
const PATHS = {
common: path.resolve(__dirname, 'dev/common'),
view: path.resolve(__dirname, 'dev/views'),
prod: path.resolve(__dirname, 'prod')
};
let NODE_ENV = 'development';
const config = merge([
{
entry: {
common: PATHS.common + '/common.js',
main: PATHS.view + '/main/main.js',
about: PATHS.view + '/about/about.js',
contact: PATHS.view + '/contact/contact.js',
head: PATHS.view + '/about/head/head.js',
},
output: {
path: PATHS.prod + '/compiled',
publicPath: '',
chunkFilename: '[name]/[id].[chunkhash].js',
filename: '[name]/[name].js',
/**
* Полволяет получить доступ к модулю из глобальной области видимости
*/
library: '[name]'
},
plugins: [
/**
* В случае ошибки точки входа, не генерировать файлы сборки
*/
new webpack.NoEmitOnErrorsPlugin(),
/**
* common.js - набор повторяемых подключаемых модулей из точек входа
*/
new webpack.optimize.CommonsChunkPlugin({
name: "common",
minChunks: 2
}),
/**
* Плагин генерирует .json с версиями файлов
*/
new AssetsPlugin({
filename: 'assets.json',
path: PATHS.prod + '/compiled/'
}),
],
resolve: {
extensions: ['*', '.css', '.pcss', '.js', '.json'],
modules: ["node_modules"]
},
/**
* Предупреждение о весе файлов
*/
performance: {
hints: false
},
/**
* #eval or eval-source-map for development
* #cheap-module-source-map for production
*/
devtool: NODE_ENV == 'development' ? '#eval-source-map' : '#cheap-module-source-map'
}
]);
// Вынесенные модули
module.exports = function(env) {
NODE_ENV = env || 'development';
if(env === 'development') {
return [
merge([
config,
define(),
js(),
images(),
cssTop(),
]),
merge([
config,
define(),
js(),
images(),
cssBottom(),
])
]
}
};
// Модуль js()
module.exports = function() {
return {
module: {
rules: [
{
test: /\.js$/,
loader: 'babel-loader',
exclude: /node_modules/
}
]
}
}
};
// Модуль cssTop()
const ExtractTextPlugin = require('extract-text-webpack-plugin');
module.exports = function (paths) {
return {
module: {
rules: [
{
test: /\.css$/,
loader: 'style-loader!css-loader!autoprefixer?browsers=last 2 version',
include: paths,
use: ExtractTextPlugin.extract({
publicPath: '../',
fallback: 'style-loader',
use: ['css-loader?importLoaders=1', 'postcss-loader'],
})
},
{
test: /\.pcss$/,
use: ExtractTextPlugin.extract({
fallback: 'style-loader',
use: [
'css-loader',
{
loader: 'postcss-loader',
options: {
plugins: [
require('precss')(),
require('postcss-bgimage')({mode: 'cutter'}),
require('postcss-short')({}),
require('postcss-import')({}),
require('postcss-cssnext')({
browsers: ['last 2 versions', '> 5%'],
}),
require('cssnano')({})
]
}
}
]
})
}
]
},
plugins: [
/**
* Вынос стилей в отдельный файл
*/
new ExtractTextPlugin({
filename: './[name]/[name].top.css',
allChunks: true
})
]
}
};
Остальные модули не так важны.
Натыкался на
такой ишью, но он для первого webpack'a.
Вложенность может быть и трёх и четырёх уровневая. Как добиться сохранения вложенности при сборке файлов??
Прошу помочь!
Средний
Средний
