javascript/NativeScript
1
0
Fork 0
mirror of https://github.com/NativeScript/NativeScript.git synced 2025-08-15 11:01:21 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix: sass + add copy plugin

Browse Source
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
Download Patch File Download Diff File Expand all files Collapse all files

156
packages/webpack5/__tests__/configuration/__snapshots__/react.spec.ts.snap
View File

@ -123,9 +123,9 @@ exports[`react configuration > android > adds ReactRefreshWebpackPlugin when HMR
{ {
loader: 'css2json-loader' 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\\"' 'process.env.NODE_ENV': '\\"development\\"'
} }
), ),
/* config.plugin('WatchStateLoggerPlugin') */ /* config.plugin('CopyWebpackPlugin') */
new WatchStateLoggerPlugin(), 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') */ /* config.plugin('HotModuleReplacementPlugin') */
new HotModuleReplacementPlugin(), new HotModuleReplacementPlugin(),
/* config.plugin('ReactRefreshPlugin') */ /* config.plugin('ReactRefreshPlugin') */
@ -317,9 +348,9 @@ exports[`react configuration > android > base config 1`] = `
{ {
loader: 'css2json-loader' 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\\"' 'process.env.NODE_ENV': '\\"development\\"'
} }
), ),
/* config.plugin('WatchStateLoggerPlugin') */ /* config.plugin('CopyWebpackPlugin') */
new WatchStateLoggerPlugin() 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: { entry: {
bundle: [ bundle: [
@ -511,9 +573,9 @@ exports[`react configuration > ios > adds ReactRefreshWebpackPlugin when HMR ena
{ {
loader: 'css2json-loader' 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\\"' 'process.env.NODE_ENV': '\\"development\\"'
} }
), ),
/* config.plugin('WatchStateLoggerPlugin') */ /* config.plugin('CopyWebpackPlugin') */
new WatchStateLoggerPlugin(), 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') */ /* config.plugin('HotModuleReplacementPlugin') */
new HotModuleReplacementPlugin(), new HotModuleReplacementPlugin(),
/* config.plugin('ReactRefreshPlugin') */ /* config.plugin('ReactRefreshPlugin') */
@ -708,9 +801,9 @@ exports[`react configuration > ios > base config 1`] = `
{ {
loader: 'css2json-loader' 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\\"' 'process.env.NODE_ENV': '\\"development\\"'
} }
), ),
/* config.plugin('WatchStateLoggerPlugin') */ /* config.plugin('CopyWebpackPlugin') */
new WatchStateLoggerPlugin() 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: { entry: {
bundle: [ bundle: [

78
packages/webpack5/__tests__/configuration/__snapshots__/vue.spec.ts.snap
View File

@ -114,9 +114,9 @@ exports[`vue configuration for android 1`] = `
{ {
loader: 'css2json-loader' 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' process: 'global.process'
} }
), ),
/* config.plugin('WatchStateLoggerPlugin') */ /* config.plugin('CopyWebpackPlugin') */
new WatchStateLoggerPlugin() 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: { entry: {
bundle: [ bundle: [
@ -317,9 +348,9 @@ exports[`vue configuration for ios 1`] = `
{ {
loader: 'css2json-loader' 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' process: 'global.process'
} }
), ),
/* config.plugin('WatchStateLoggerPlugin') */ /* config.plugin('CopyWebpackPlugin') */
new WatchStateLoggerPlugin() 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: { entry: {
bundle: [ bundle: [

1
packages/webpack5/package.json
View File

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

31
packages/webpack5/src/configuration/base.ts
View File

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