electron-react-webpack-boilerplate
v1.14.4
Published
Minimal Electron, React, PostCSS and Webpack boilerplate to help you get started with building your next app.
Downloads
34
Maintainers
Readme
Minimal Electron, React and Webpack boilerplate
Minimal Electron, React, PostCSS and Webpack boilerplate to help you get started with building your next app.
Table of contents
Install
Clone this repo
git clone https://github.com/alexdevero/electron-react-webpack-boilerplate.git
Install dependencies
npm install
or
yarn
Usage
Run the app
npm run start
or
yarn start
Build the app (automatic)
npm run package
or
yarn package
Build the app (manual)
npm run build
or
yarn build
Test the app (after npm run build
|| yarn run build
)
npm run prod
yarn prod
Add Sass
Adding Sass to boilerplate requires updating webpack configs and adding necessary loaders.
- To
webpack.build.config.js
andwebpack.dev.config.js
add new object torules
:
{
test: /\.scss$/,
use: [
{ loader: 'style-loader' },
{ loader: 'css-loader' },
{ loader: 'sass-loader' }],
include: defaultInclude
}
Install additional loaders for sass,
sass-loader
andnode-sass
.Rename all CSS file to
.scss
.
Change app title
This boilerplate uses HTML Webpack Plugin to generate the HTML file of the app. Changing app title is possible only through webpack configs, webpack.build.config.js
and webpack.dev.config.js
. App title can be changed by adding objects of options.
In webpack.build.config.js
:
plugins: [
new HtmlWebpackPlugin({title: 'New app title '}),// Add this (line 41)
new MiniCssExtractPlugin({
// Options similar to the same options in webpackOptions.output
// both options are optional
filename: 'bundle.css',
chunkFilename: '[id].css'
}),
new webpack.DefinePlugin({
'process.env.NODE_ENV': JSON.stringify('production')
}),
new BabiliPlugin()
],
In webpack.dev.config.js
:
plugins: [
new HtmlWebpackPlugin({title: 'New app title '}),// Add this (line 36)
new webpack.DefinePlugin({
'process.env.NODE_ENV': JSON.stringify('development')
})
],
Contact and Support
I want your feedback! Here's a list of different ways to me and request help:
- Report bugs and submit feature requests to GitHub issues.
- And do not forget to follow @alexdevero on Twitter!
If you feel generous and want to show some extra appreciation:
Code of Conduct
Contributor Code of Conduct. By participating in this project you agree to abide by its terms.
License
MIT © Alex Devero.