Conversation
|
@Marianne380 I've added SASS transpilation in |
configs/reactified.js
Outdated
| const sassRulesMinified = | ||
| sassLoadPaths.length > 0 | ||
| ? [ | ||
| { | ||
| test: /\.s?css$/, | ||
| use: [ | ||
| MiniCssExtractPlugin.loader, | ||
| 'css-loader', | ||
| { | ||
| loader: 'sass-loader', | ||
| options: { | ||
| sassOptions: { | ||
| loadPaths: sassLoadPaths, | ||
| outputStyle: 'compressed', | ||
| sourceMap: ! isProduction, | ||
| }, | ||
| }, | ||
| }, | ||
| ], | ||
| }, | ||
| ] | ||
| : []; | ||
|
|
||
| const sassRulesUnminified = | ||
| sassLoadPaths.length > 0 | ||
| ? [ | ||
| { | ||
| test: /\.s?css$/, | ||
| use: [ | ||
| MiniCssExtractPlugin.loader, | ||
| 'css-loader', | ||
| { | ||
| loader: 'sass-loader', | ||
| options: { | ||
| sassOptions: { | ||
| loadPaths: sassLoadPaths, | ||
| outputStyle: 'expanded', | ||
| sourceMap: ! isProduction, | ||
| }, | ||
| }, | ||
| }, | ||
| ], | ||
| }, | ||
| ] | ||
| : []; |
There was a problem hiding this comment.
Since outputStyle seems to be the only difference, could it be refactored ?
Maybe something to use like :
module: {
rules: [ ...transpilationRules, ...getSassRules( 'compressed' ) ],
}
module: {
rules: [ ...transpilationRules, ...getSassRules( 'expanded' ) ],
}There was a problem hiding this comment.
Good idea, I've been a bit further in 8ec204f.
| "test": "wp-scripts test-unit-js", | ||
| "lint": "wp-scripts lint-js" | ||
| }, | ||
| "peerDependencies": { |
| verbose: false, | ||
| cleanOnceBeforeBuildPatterns: [], | ||
| cleanAfterEveryBuildPatterns: [ | ||
| path.join( process.cwd(), '**/*.work' ), |
There was a problem hiding this comment.
I know this existed before, but noticed cleanAfterEveryBuildPatterns uses process.cwd() which cleans **/*.work in the entire project, right ?
Should we scope it to destination instead to only clean the build directory?
There was a problem hiding this comment.
I think you're right. But .work files are artifact that must be deleted anyway so there is not risk to leave it as it is right now.
Since it is really old code and that our three plugins depends on it, I'd like to cover it with tests before modifying it.
Is it ok for you?
What?
Let's refactor
webpack.config.jsfrom all our plugins.How?
Create new API to generate webpack configurations:
getVanillaConfigfor Vanilla JS and CSS files (meaning no complex build rules nor JSX transpilation).getReactifiedConfigfor React-like JS and CSS files (perfect for custom sidebars or blocks for instance).