kevoj / electron-react-ant-boilerplate Goto Github PK

Electron + Webpack 4 + Babel 7 + React 16 + PostCSS + Sass + Ant Design + Jest + Enzyme + Eslint

License: MIT License

JavaScript 90.42% CSS 7.71% HTML 1.87%

electron-boilerplate electron-ant-design electron-ant electron-sass electron-webpack electron-react electron-webpack-sample boilerplate react electron-es6

electron-react-ant-boilerplate's Introduction

Hi 👋 My name is Leo

Senior Full Stack Developer

🌍 I'm based in Colombia
✉️ You can contact me at [email protected]
🧠 I'm learning WebAssembly
🤝 I'm open to collaborating on any project that helps the community

Skills

Socials

Badges

My GitHub Stats

electron-react-ant-boilerplate's People

Stargazers

Watchers

Forkers

rajsek menzil ares2013 mirfahad58 justinwlin mertyilmazx albcunha

electron-react-ant-boilerplate's Issues

Problem with antd dark theme

Error: Cannot find module './src/ant-design/dark-theme' after install the theme via npm and put in the less loader, any idea why?

const lessLoader = AntdScssThemePlugin.themify({
loader: "less-loader",
options: {
modifyVars: darkTheme,
sourceMap: isDev,
javascriptEnabled: true
}
});

Trying to set a different language with ant Config Provider

Here is the code:

// Libs
import React, { Component } from "react";
import PropTypes from "prop-types";
import { Layout } from "antd";
import { ConfigProvider } from 'antd';
import ptBR from 'antd/lib/locale/pt_BR'

// Styles
import styles from "./App.scss";
// Components
import Header from "@/components/@shared/Header";
import Footer from "@/components/@shared/Footer";

/**
 * App
 *
 * @class App
 * @extends {Component}
 */
class App extends Component {
  static propTypes = {
    children: PropTypes.node.isRequired
  };

  constructor(props) {
    super(props);
  }

  render() {
    const { children } = this.props;
    return (
      <ConfigProvider locale={ptBR}>
        <Layout>
          <Header />
          <Layout className={styles.app}>
            <Layout.Content>{children}</Layout.Content>
          </Layout>
          <Footer />
        </Layout>
      </ConfigProvider>
    );
  }
}

export default App;

What I tried:
I´m following ant design suggestion to change language:
https://ant.design/docs/react/i18n

What I´d like:
To use ConfigProvider locale to change the language in all components.

Any ideas? I was able to set only protable locale, but dropdowns and other components are still in chinese. I did through this issue solution:
ant-design/pro-table#79 (comment)

use child process

I put the integration in the webpack config

target: "electron-renderer",
 base: {
   node: {
     fs: 'empty',
     child_process: 'empty'
   },

then call in a react component

const spawn = require('child_process').spawn;
   const ls = spawn('ls', ['-lh', '/usr']);

        ls.stdout.on('data', (data) => {
            console.log(`stdout: ${data}`);
        });

        ls.stderr.on('data', (data) => {
            console.log(`stderr: ${data}`);
        });

        ls.on('close', (code) => {
            console.log(`child process exited with code ${code}`);
        });

and get this error
main.js:272309 Uncaught TypeError: spawn is not a function

Any ideas about that?

Can't start or build

I cloned the repo, npm install, then when I try npm run start or npm run build it get stucks at
`

[email protected] build C:\Users\me\ElectronProjects\electron-react-ant-boilerplate
node -r @babel/register & webpack --config webpack.prod.config.babel.js

does not build

cannot build usingyarn install...

0 warnings and 6 errors generated.
make: *** [Release/obj.target/fse/fsevents.o] Error 1
gyp ERR! build error
gyp ERR! stack Error: `make` failed with exit code: 2
gyp ERR! stack     at ChildProcess.onExit (/Users/ronenmagid/dev/electron-react-ant-boilerplate/node_modules/node-gyp/lib/build.js:262:23)
gyp ERR! stack     at ChildProcess.emit (events.js:200:13)
gyp ERR! stack     at Process.ChildProcess._handle.onexit (internal/child_process.js:272:12)
gyp ERR! System Darwin 18.6.0
gyp ERR! command \"/usr/local/Cellar/node/12.4.0/bin/node\" \"/Users/ronenmagid/dev/electron-react-ant-boilerplate/node_modules/node-gyp/bin/node-gyp.js\" \"build\" \"--fallback-to-build\" \"--module=/Users/ronenmagid/dev/electron-react-ant-boilerplate/node_modules/fsevents/lib/binding/Release/node-v72-darwin-x64/fse.node\" \"--module_name=fse\" \"--module_path=/Users/ronenmagid/dev/electron-react-ant-boilerplate/node_modules/fsevents/lib/binding/Release/node-v72-darwin-x64\" \"--napi_version=4\" \"--node_abi_napi=napi\" \"--napi_build_version=0\" \"--node_napi_label=node-v72\"
gyp ERR! cwd /Users/ronenmagid/dev/electron-react-ant-boilerplate/node_modules/fsevents
gyp ERR! node -v v12.5.0
gyp ERR! node-gyp -v v3.8.0
gyp ERR! not ok
node-pre-gyp ERR! build error
node-pre-gyp ERR! stack Error: Failed to execute '/usr/local/Cellar/node/12.4.0/bin/node /Users/ronenmagid/dev/electron-react-ant-boilerplate/node_modules/node-gyp/bin/node-gyp.js build --fallback-to-build --module=/Users/ronenmagid/dev/electron-react-ant-boilerplate/node_modules/fsevents/lib/binding/Release/node-v72-darwin-x64/fse.node --module_name=fse --module_path=/Users/ronenmagid/dev/electron-react-ant-boilerplate/node_modules/fsevents/lib/binding/Release/node-v72-darwin-x64 --napi_version=4 --node_abi_napi=napi --napi_build_version=0 --node_napi_label=node-v72' (1)
node-pre-gyp ERR! stack     at ChildProcess.<anonymous> (/Users/ronenmagid/dev/electron-react-ant-boilerplate/node_modules/fsevents/node_modules/node-pre-gyp/lib/util/compile.js:83:29)
node-pre-gyp ERR! stack     at ChildProcess.emit (events.js:200:13)
node-pre-gyp ERR! stack     at maybeClose (internal/child_process.js:1021:16)
node-pre-gyp ERR! stack     at Process.ChildProcess._handle.onexit (internal/child_process.js:283:5)
node-pre-gyp ERR! System Darwin 18.6.0
node-pre-gyp ERR! command \"/usr/local/Cellar/node/12.4.0/bin/node\" \"/Users/ronenmagid/dev/electron-react-ant-boilerplate/node_modules/fsevents/node_modules/node-pre-gyp/bin/node-pre-gyp\" \"install\" \"--fallback-to-build\"
node-pre-gyp ERR! cwd /Users/ronenmagid/dev/electron-react-ant-boilerplate/node_modules/fsevents
node-pre-gyp ERR! node -v v12.5.0
node-pre-gyp ERR! node-pre-gyp -v v0.12.0
node-pre-gyp ERR! not ok
Failed to execute '/usr/local/Cellar/node/12.4.0/bin/node /Users/ronenmagid/dev/electron-react-ant-boilerplate/node_modules/node-gyp/bin/node-gyp.js build --fallback-to-build --module=/Users/ronenmagid/dev/[1/4] ⠁ node-sass

Unable to use Atlaskit (CSS library)

I cannot compile with Atlaskit components, May be because are written in CSS, some webpack issue?. I attached a demo on simple create react app that not work with the boilerplate because cannot find the modules.

https://stackblitz.com/edit/react-px7lnw

Importing style from .scss

Hi,
I have noticed that CSS from the .scss file are imported into styles and then styles.app or styles.helloWorld is used. Is there any particular reason for that?

Isnt importing "myStylesheet.scss" enough at the start?

Cheers