fix: sass + add copy plugin

This commit is contained in:
Igor Randjelovic
2020-11-23 15:11:36 +01:00
parent f09d746cc5
commit 30c31a252b
4 changed files with 234 additions and 32 deletions

View File

@ -123,9 +123,9 @@ exports[`react configuration > android > adds ReactRefreshWebpackPlugin when HMR
{
loader: 'css2json-loader'
},
/* config.module.rule('scss').use('scss-loader') */
/* config.module.rule('scss').use('sass-loader') */
{
loader: 'scss-loader'
loader: 'sass-loader'
}
]
}
@ -182,8 +182,39 @@ exports[`react configuration > android > adds ReactRefreshWebpackPlugin when HMR
'process.env.NODE_ENV': '\\"development\\"'
}
),
/* config.plugin('WatchStateLoggerPlugin') */
new WatchStateLoggerPlugin(),
/* config.plugin('CopyWebpackPlugin') */
new CopyPlugin(
{
patterns: [
{
from: 'assets/**',
context: 'src',
noErrorOnMissing: true,
globOptions: {
dot: false
}
},
{
from: 'fonts/**',
context: 'src',
noErrorOnMissing: true,
globOptions: {
dot: false
}
},
{
from: '**/*.+(jpg|png)',
context: 'src',
noErrorOnMissing: true,
globOptions: {
dot: false
}
}
]
}
),
/* config.plugin('WatchStatePlugin') */
new WatchStatePlugin(),
/* config.plugin('HotModuleReplacementPlugin') */
new HotModuleReplacementPlugin(),
/* config.plugin('ReactRefreshPlugin') */
@ -317,9 +348,9 @@ exports[`react configuration > android > base config 1`] = `
{
loader: 'css2json-loader'
},
/* config.module.rule('scss').use('scss-loader') */
/* config.module.rule('scss').use('sass-loader') */
{
loader: 'scss-loader'
loader: 'sass-loader'
}
]
}
@ -376,8 +407,39 @@ exports[`react configuration > android > base config 1`] = `
'process.env.NODE_ENV': '\\"development\\"'
}
),
/* config.plugin('WatchStateLoggerPlugin') */
new WatchStateLoggerPlugin()
/* config.plugin('CopyWebpackPlugin') */
new CopyPlugin(
{
patterns: [
{
from: 'assets/**',
context: 'src',
noErrorOnMissing: true,
globOptions: {
dot: false
}
},
{
from: 'fonts/**',
context: 'src',
noErrorOnMissing: true,
globOptions: {
dot: false
}
},
{
from: '**/*.+(jpg|png)',
context: 'src',
noErrorOnMissing: true,
globOptions: {
dot: false
}
}
]
}
),
/* config.plugin('WatchStatePlugin') */
new WatchStatePlugin()
],
entry: {
bundle: [
@ -511,9 +573,9 @@ exports[`react configuration > ios > adds ReactRefreshWebpackPlugin when HMR ena
{
loader: 'css2json-loader'
},
/* config.module.rule('scss').use('scss-loader') */
/* config.module.rule('scss').use('sass-loader') */
{
loader: 'scss-loader'
loader: 'sass-loader'
}
]
}
@ -570,8 +632,39 @@ exports[`react configuration > ios > adds ReactRefreshWebpackPlugin when HMR ena
'process.env.NODE_ENV': '\\"development\\"'
}
),
/* config.plugin('WatchStateLoggerPlugin') */
new WatchStateLoggerPlugin(),
/* config.plugin('CopyWebpackPlugin') */
new CopyPlugin(
{
patterns: [
{
from: 'assets/**',
context: 'src',
noErrorOnMissing: true,
globOptions: {
dot: false
}
},
{
from: 'fonts/**',
context: 'src',
noErrorOnMissing: true,
globOptions: {
dot: false
}
},
{
from: '**/*.+(jpg|png)',
context: 'src',
noErrorOnMissing: true,
globOptions: {
dot: false
}
}
]
}
),
/* config.plugin('WatchStatePlugin') */
new WatchStatePlugin(),
/* config.plugin('HotModuleReplacementPlugin') */
new HotModuleReplacementPlugin(),
/* config.plugin('ReactRefreshPlugin') */
@ -708,9 +801,9 @@ exports[`react configuration > ios > base config 1`] = `
{
loader: 'css2json-loader'
},
/* config.module.rule('scss').use('scss-loader') */
/* config.module.rule('scss').use('sass-loader') */
{
loader: 'scss-loader'
loader: 'sass-loader'
}
]
}
@ -767,8 +860,39 @@ exports[`react configuration > ios > base config 1`] = `
'process.env.NODE_ENV': '\\"development\\"'
}
),
/* config.plugin('WatchStateLoggerPlugin') */
new WatchStateLoggerPlugin()
/* config.plugin('CopyWebpackPlugin') */
new CopyPlugin(
{
patterns: [
{
from: 'assets/**',
context: 'src',
noErrorOnMissing: true,
globOptions: {
dot: false
}
},
{
from: 'fonts/**',
context: 'src',
noErrorOnMissing: true,
globOptions: {
dot: false
}
},
{
from: '**/*.+(jpg|png)',
context: 'src',
noErrorOnMissing: true,
globOptions: {
dot: false
}
}
]
}
),
/* config.plugin('WatchStatePlugin') */
new WatchStatePlugin()
],
entry: {
bundle: [

View File

@ -114,9 +114,9 @@ exports[`vue configuration for android 1`] = `
{
loader: 'css2json-loader'
},
/* config.module.rule('scss').use('scss-loader') */
/* config.module.rule('scss').use('sass-loader') */
{
loader: 'scss-loader'
loader: 'sass-loader'
}
]
},
@ -191,8 +191,39 @@ exports[`vue configuration for android 1`] = `
process: 'global.process'
}
),
/* config.plugin('WatchStateLoggerPlugin') */
new WatchStateLoggerPlugin()
/* config.plugin('CopyWebpackPlugin') */
new CopyPlugin(
{
patterns: [
{
from: 'assets/**',
context: 'src',
noErrorOnMissing: true,
globOptions: {
dot: false
}
},
{
from: 'fonts/**',
context: 'src',
noErrorOnMissing: true,
globOptions: {
dot: false
}
},
{
from: '**/*.+(jpg|png)',
context: 'src',
noErrorOnMissing: true,
globOptions: {
dot: false
}
}
]
}
),
/* config.plugin('WatchStatePlugin') */
new WatchStatePlugin()
],
entry: {
bundle: [
@ -317,9 +348,9 @@ exports[`vue configuration for ios 1`] = `
{
loader: 'css2json-loader'
},
/* config.module.rule('scss').use('scss-loader') */
/* config.module.rule('scss').use('sass-loader') */
{
loader: 'scss-loader'
loader: 'sass-loader'
}
]
},
@ -394,8 +425,39 @@ exports[`vue configuration for ios 1`] = `
process: 'global.process'
}
),
/* config.plugin('WatchStateLoggerPlugin') */
new WatchStateLoggerPlugin()
/* config.plugin('CopyWebpackPlugin') */
new CopyPlugin(
{
patterns: [
{
from: 'assets/**',
context: 'src',
noErrorOnMissing: true,
globOptions: {
dot: false
}
},
{
from: 'fonts/**',
context: 'src',
noErrorOnMissing: true,
globOptions: {
dot: false
}
},
{
from: '**/*.+(jpg|png)',
context: 'src',
noErrorOnMissing: true,
globOptions: {
dot: false
}
}
]
}
),
/* config.plugin('WatchStatePlugin') */
new WatchStatePlugin()
],
entry: {
bundle: [

View File

@ -18,6 +18,7 @@
"babel-loader": "^8.2.1",
"clean-webpack-plugin": "^3.0.0",
"cli-highlight": "^2.1.8",
"copy-webpack-plugin": "^6.3.2",
"css": "^3.0.0",
"css-loader": "^5.0.1",
"loader-utils": "^2.0.0",

View File

@ -4,19 +4,25 @@ import {
getAbsoluteDistPath,
getEntryPath,
getPlatform,
getProjectRootPath,
} from '../helpers/project';
import { CleanWebpackPlugin } from 'clean-webpack-plugin';
import { DefinePlugin, HotModuleReplacementPlugin } from 'webpack';
import { BundleAnalyzerPlugin } from 'webpack-bundle-analyzer';
import { CleanWebpackPlugin } from 'clean-webpack-plugin';
import CopyWebpackPlugin from 'copy-webpack-plugin';
import TerserPlugin from 'terser-webpack-plugin';
// import { WatchStateLoggerPlugin } from '../plugins/WatchStateLoggerPlugin';
import { WatchStatePlugin } from '../plugins/WatchStatePlugin';
import TerserPlugin from 'terser-webpack-plugin';
import { BundleAnalyzerPlugin } from 'webpack-bundle-analyzer';
import path from 'path';
export default function (config: Config, env: IWebpackEnv): Config {
const entryPath = getEntryPath();
const platform = getPlatform();
const mode = env.production ? 'production' : 'development';
const appPath = path.dirname(entryPath);
// set mode
config.mode(mode);
@ -196,11 +202,20 @@ export default function (config: Config, env: IWebpackEnv): Config {
// todo: we should probably move away from CopyWebpackPlugin
// it has many issues we can solve by simply copying files **before** the build even starts
// this is just a temp inline plugin that does nothing while building out the configs.
// config.plugin('CopyWebpackPlugin').use(function CopyPluginTemp() {}, [
// {
// patterns: [],
// },
// ]);
const copyPaths = ['assets/**', 'fonts/**', '**/*.+(jpg|png)'];
config.plugin('CopyWebpackPlugin').use(CopyWebpackPlugin, [
{
patterns: copyPaths.map((from) => ({
from,
context: appPath,
noErrorOnMissing: true,
globOptions: {
dot: false,
// ignore: [``]
},
})),
},
]);
// add the WatchStateLogger plugin used to notify the CLI of build state
// config.plugin('WatchStateLoggerPlugin').use(WatchStateLoggerPlugin);