From 12f64bac19ea103e44f6344b7ff4b81b298ac4ce Mon Sep 17 00:00:00 2001 From: Vasek Mlejnsky Date: Mon, 6 Aug 2018 10:43:20 +0200 Subject: [PATCH] Add a webpack config to run with local Trezor Connect --- package.json | 1 + src/js/actions/TrezorConnectActions.js | 7 +- webpack/config.dev.local.babel.js | 164 +++++++++++++++++++++++++ webpack/constants.js | 10 +- 4 files changed, 180 insertions(+), 2 deletions(-) create mode 100644 webpack/config.dev.local.babel.js diff --git a/package.json b/package.json index 12fdc04e..125774f9 100644 --- a/package.json +++ b/package.json @@ -16,6 +16,7 @@ "license": "LGPL-3.0+", "scripts": { "dev": "webpack-dev-server --config ./webpack/config.dev.babel.js --mode development", + "dev:local": "webpack-dev-server --config ./webpack/config.dev.local.babel.js --mode development", "build": "rm -rf build && webpack --config ./webpack/config.prod.babel.js --progress", "flow": "flow check src/js", "lint": "npx eslint ./src ./webpack", diff --git a/src/js/actions/TrezorConnectActions.js b/src/js/actions/TrezorConnectActions.js index eb7c64b6..9ad63574 100644 --- a/src/js/actions/TrezorConnectActions.js +++ b/src/js/actions/TrezorConnectActions.js @@ -117,7 +117,12 @@ export const init = (): AsyncAction => async (dispatch: Dispatch, getState: GetS debug: false, popup: false, webusb: true, - pendingTransportEvent: (getState().devices.length < 1) + pendingTransportEvent: (getState().devices.length < 1), + + // Use this if running 'yarn dev:local' + connectSrc: window.location.origin + '/', + // iframeSrc: window.location.origin + '/iframe.html', + // webusbSrc: window.location.origin + '/webusb.html', }); } catch (error) { // dispatch({ diff --git a/webpack/config.dev.local.babel.js b/webpack/config.dev.local.babel.js new file mode 100644 index 00000000..b4160fc7 --- /dev/null +++ b/webpack/config.dev.local.babel.js @@ -0,0 +1,164 @@ +import { + TREZOR_CONNECT_ROOT, + TREZOR_CONNECT_HTML, + TREZOR_CONNECT_FILES, + TREZOR_CONNECT, TREZOR_IFRAME, TREZOR_POPUP, TREZOR_WEBUSB, + SRC, + BUILD, + PORT +} from './constants'; + + +import webpack from 'webpack'; +import HtmlWebpackPlugin from 'html-webpack-plugin'; +import CopyWebpackPlugin from 'copy-webpack-plugin'; +import MiniCssExtractPlugin from 'mini-css-extract-plugin'; + +module.exports = { + watch: true, + mode: 'development', + devtool: 'inline-source-map', + entry: { + 'index': ['react-hot-loader/patch', `${SRC}js/index.js`], + 'trezor-connect-npm': `${TREZOR_CONNECT}.js`, + // 'extension-permissions': `${TREZOR_CONNECT_ROOT}src/js/extensionPermissions.js`, + 'iframe': TREZOR_IFRAME, + 'popup': TREZOR_POPUP, + 'webusb': TREZOR_WEBUSB, + }, + output: { + filename: '[name].[hash].js', + path: BUILD, + globalObject: 'this', // fix for HMR inside WebWorker from 'hd-wallet' + }, + devServer: { + contentBase: SRC, + hot: true, + https: false, + port: PORT, + stats: 'minimal', + inline: true, + }, + module: { + rules: [ + { + test: /\.jsx?$/, + exclude: /node_modules/, + use: ['babel-loader'] + }, + { + test: /\.less$/, + use: [ + { + loader: MiniCssExtractPlugin.loader, + options: { publicPath: '../' } + }, + 'css-loader', + 'less-loader', + ] + }, + { + test: /\.(png|gif|jpg)$/, + loader: 'file-loader?name=./images/[name].[ext]', + query: { + outputPath: './images', + name: '[name].[ext]', + } + }, + { + test: /\.(ttf|eot|svg|woff|woff2)$/, + loader: 'file-loader', + query: { + outputPath: './fonts', + name: '[name].[ext]', + }, + }, + { + type: 'javascript/auto', + test: /\.json/, + exclude: /(node_modules)/, + loader: 'file-loader', + query: { + outputPath: './data', + name: '[name].[ext]', + }, + }, + { + type: 'javascript/auto', + test: /\.wasm$/, + loader: 'file-loader', + query: { + name: 'js/[name].[ext]', + }, + }, + ], + }, + resolve: { + modules: [SRC, 'node_modules', `${TREZOR_CONNECT_ROOT}/node_modules`], + alias: { + 'trezor-connect': `${TREZOR_CONNECT}` + } + }, + performance: { + hints: false + }, + plugins: [ + new MiniCssExtractPlugin({ + filename: '[name].css', + chunkFilename: '[id].css', + }), + + new HtmlWebpackPlugin({ + chunks: ['index'], + template: `${SRC}index.html`, + filename: 'index.html', + inject: true + }), + + new HtmlWebpackPlugin({ + chunks: ['iframe'], + filename: `iframe.html`, + template: `${TREZOR_CONNECT_HTML}iframe.html`, + inject: false + }), + new HtmlWebpackPlugin({ + chunks: ['popup'], + filename: 'popup.html', + template: `${TREZOR_CONNECT_HTML}popup.html`, + inject: false + }), + new HtmlWebpackPlugin({ + chunks: ['webusb'], + filename: `webusb.html`, + template: `${TREZOR_CONNECT_HTML}webusb.html`, + inject: true + }), + // new HtmlWebpackPlugin({ + // chunks: ['extension-permissions'], + // filename: `extension-permissions.html`, + // template: `${TREZOR_CONNECT_HTML}extension-permissions.html`, + // inject: true + // }), + + new CopyWebpackPlugin([ + { from: TREZOR_CONNECT_FILES, to: 'data' }, + ]), + + new webpack.optimize.OccurrenceOrderPlugin(), + new webpack.NoEmitOnErrorsPlugin(), + new webpack.HotModuleReplacementPlugin(), + new webpack.NamedModulesPlugin(), + + new webpack.DefinePlugin({ + LOCAL: JSON.stringify(`http://localhost:${PORT}/`), + }), + + // ignore node lib from trezor-link + new webpack.IgnorePlugin(/\/iconv-loader$/), + ], + // ignoring "fs" import in fastxpub + node: { + fs: "empty", + path: "empty", + }, +} diff --git a/webpack/constants.js b/webpack/constants.js index 8717349e..92858a2f 100644 --- a/webpack/constants.js +++ b/webpack/constants.js @@ -9,9 +9,17 @@ const constants: Object = Object.freeze({ SRC: path.join(ABSOLUTE_BASE, 'src/'), PORT: 8081, INDEX: path.join(ABSOLUTE_BASE, 'src/index.html'), - TREZOR_CONNECT_ROOT: path.join(ABSOLUTE_BASE, '../trezor.js2/'), + TREZOR_CONNECT_ROOT: path.join(ABSOLUTE_BASE, '../trezor-connect/') }); +export const TREZOR_CONNECT_ROOT: string = constants.TREZOR_CONNECT_ROOT; +export const TREZOR_CONNECT: string = path.join(constants.TREZOR_CONNECT_ROOT, 'src/js/index'); +export const TREZOR_IFRAME: string = path.join(constants.TREZOR_CONNECT_ROOT, 'src/js/iframe/iframe.js'); +export const TREZOR_POPUP: string = path.join(constants.TREZOR_CONNECT_ROOT, 'src/js/popup/popup.js'); +export const TREZOR_WEBUSB: string = path.join(constants.TREZOR_CONNECT_ROOT, 'src/js/webusb/index.js'); +export const TREZOR_CONNECT_HTML: string = path.join(constants.TREZOR_CONNECT_ROOT, 'src/html/'); +export const TREZOR_CONNECT_FILES: string = path.join(constants.TREZOR_CONNECT_ROOT, 'src/data/'); + export const BUILD: string = constants.BUILD; export const SRC: string = constants.SRC; export const PORT: string = constants.PORT;