moved themes to separate folder

This commit is contained in:
Art Lowel
2019-05-28 13:24:30 +02:00
parent cfcf496cc1
commit 11d06e34b1
34 changed files with 228 additions and 178 deletions

View File

@@ -1,137 +1,196 @@
const CopyWebpackPlugin = require('copy-webpack-plugin');
const path = require('path');
const fs = require('fs');
const {
root,
join,
globalCSSImports,
themeReplaceOptions
root,
join,
globalCSSImports,
themeReplaceOptions,
theme,
themePath
} = require('./helpers');
const srcPath = root('src');
const getThemedPath = (componentPath, ext) => {
const parsedPath = path.parse(componentPath);
const relativePath = path.relative(srcPath, parsedPath.dir);
return path.join(themePath, relativePath, `${parsedPath.name}.${ext}`);
};
module.exports = {
mode: 'development',
devtool: 'source-map',
resolve: {
extensions: ['.ts', '.js', '.json']
},
output: {
path: root('dist')
},
watchOptions: {
aggregateTimeout: 50,
},
node: {
fs: "empty",
module: "empty"
},
module: {
rules: [
mode: 'development',
devtool: 'source-map',
resolve: {
extensions: ['.ts', '.js', '.json']
},
output: {
path: root('dist')
},
watchOptions: {
aggregateTimeout: 50,
},
node: {
fs: "empty",
module: "empty"
},
module: {
rules: [
{
test: (filePath) => {
if (/\.component.ts$/.test(filePath)) {
const themedStylePath = getThemedPath(filePath, 'scss');
return fs.existsSync(themedStylePath);
} else {
return false;
}
},
use: (info) => {
const parsedPath = path.parse(info.resource);
const themedStylePath = getThemedPath(info.resource, 'scss');
return [
'debug-loader',
{
test: /\.component.ts$/,
loader: 'string-replace-loader',
options: themeReplaceOptions
},
{
test: /\.ts$/,
loader: '@ngtools/webpack'
},
{
test: /\.css$/,
use: [{
loader: 'to-string-loader',
options: {
sourceMap: true
}
},
{
loader: 'css-loader',
options: {
sourceMap: true,
modules: true
}
},
{
loader: 'postcss-loader',
options: {
sourceMap: true
}
}
]
},
{
test: /\.scss$/,
exclude: [/node_modules/,
path.resolve(__dirname, '..', 'src/styles/_exposed_variables.scss')
],
use: [
{
loader: 'raw-loader',
options: {
sourceMap: true
}
},
{
loader: 'resolve-url-loader',
options: {
sourceMap: true
}
},
{
loader: 'sass-loader',
options: {
sourceMap: true
}
},
{
loader: 'string-replace-loader',
options: themeReplaceOptions
},
{
loader: 'sass-resources-loader',
options: {
resources: globalCSSImports
},
},
'webpack-import-glob-loader'
]
},
{
test: /_exposed_variables.scss$/,
exclude: /node_modules/,
use: [{
loader: "css-loader" // translates CSS into CommonJS
}, {
loader: "sass-loader" // compiles Sass to CSS
},
{
loader: 'string-replace-loader',
options: themeReplaceOptions
},
{
loader: 'sass-resources-loader',
options: {
resources: globalCSSImports
},
}
]
},
{
test: /\.html$/,
loader: 'raw-loader'
loader: 'string-replace-loader',
options: {
search: `\.\/${parsedPath.name}\.scss`,
replace: themedStylePath,
flags: 'g'
}
}
]
},
plugins: [
new CopyWebpackPlugin([{
from: join(__dirname, '..', 'node_modules', '@fortawesome', 'fontawesome-free', 'webfonts'),
to: join('assets', 'fonts')
}, {
from: join(__dirname, '..', 'resources', 'images'),
to: join('assets', 'images')
}, {
from: join(__dirname, '..', 'resources', 'i18n'),
to: join('assets', 'i18n')
]
}
])
},
{
test: (filePath) => {
if (/\.component.ts$/.test(filePath)) {
const themedTemplatePath = getThemedPath(filePath, 'html');
return fs.existsSync(themedTemplatePath);
} else {
return false;
}
},
use: (info) => {
const parsedPath = path.parse(info.resource);
const themedTemplatePath = getThemedPath(info.resource, 'html');
return [
'debug-loader',
{
loader: 'string-replace-loader',
options: {
search: `\.\/${parsedPath.name}\.html`,
replace: themedTemplatePath,
flags: 'g'
}
}
]
}
},
{
test: /\.ts$/,
loader: '@ngtools/webpack'
},
{
test: /\.css$/,
use: [{
loader: 'to-string-loader',
options: {
sourceMap: true
}
},
{
loader: 'css-loader',
options: {
sourceMap: true,
modules: true
}
},
{
loader: 'postcss-loader',
options: {
sourceMap: true
}
}
]
},
{
test: /\.scss$/,
exclude: [/node_modules/,
path.resolve(__dirname, '..', 'src/styles/_exposed_variables.scss')
],
use: [
{
loader: 'raw-loader',
options: {
sourceMap: true
}
},
{
loader: 'resolve-url-loader',
options: {
sourceMap: true
}
},
{
loader: 'sass-loader',
options: {
sourceMap: true
}
},
{
loader: 'string-replace-loader',
options: themeReplaceOptions
},
{
loader: 'sass-resources-loader',
options: {
resources: globalCSSImports
},
},
'webpack-import-glob-loader'
]
},
{
test: /_exposed_variables.scss$/,
exclude: /node_modules/,
use: [{
loader: "css-loader" // translates CSS into CommonJS
}, {
loader: "sass-loader" // compiles Sass to CSS
},
{
loader: 'string-replace-loader',
options: themeReplaceOptions
},
{
loader: 'sass-resources-loader',
options: {
resources: globalCSSImports
},
}
]
},
{
test: /\.html$/,
loader: 'raw-loader'
}
]
},
plugins: [
new CopyWebpackPlugin([{
from: join(__dirname, '..', 'node_modules', '@fortawesome', 'fontawesome-free', 'webfonts'),
to: join('assets', 'fonts')
}, {
from: join(__dirname, '..', 'resources', 'images'),
to: join('assets', 'images')
}, {
from: join(__dirname, '..', 'resources', 'i18n'),
to: join('assets', 'i18n')
}
])
]
};