merge e2e logic for WebRenderer

examples/hippy-react-demo/scripts/hippy-webpack.web.render.dev.js

@@ -0,0 +1,113 @@
+const fs = require('fs');
+const path = require('path');
+const webpack = require('webpack');
+const HtmlWebpackPlugin = require('html-webpack-plugin');
+const CaseSensitivePathsPlugin = require('case-sensitive-paths-webpack-plugin');
+const HippyDynamicImportPlugin = require('@hippy/hippy-dynamic-import-plugin');
+const ReactRefreshWebpackPlugin = require('@hippy/hippy-react-refresh-webpack-plugin');
+const pkg = require('../package.json');
+
+const platform = 'web';
+
+module.exports = {
+  mode: 'development',
+  bail: true,
+  devServer: {
+    port: 3000,
+    hot: true,
+    liveReload: true,
+  },
+  devtool: 'source-map',
+  entry: {
+    index: ['regenerator-runtime', path.resolve(pkg.web)],
+  },
+  output: {
+    // filename: `[name].${platform}.js`,
+    filename: 'index.bundle.js',
+    path: path.resolve(`./dist/${platform}/`),
+    strictModuleExceptionHandling: true,
+    globalObject: '(0, eval)("this")',
+  },
+  plugins: [
+    new webpack.NamedModulesPlugin(),
+    new HtmlWebpackPlugin({
+      inject: true,
+      scriptLoading: 'blocking',
+      template: path.resolve('./public/index.html'),
+    }),
+    new webpack.DefinePlugin({
+      'process.env.NODE_ENV': JSON.stringify('development'),
+      __PLATFORM__: JSON.stringify(platform),
+    }),
+    new CaseSensitivePathsPlugin(),
+    new HippyDynamicImportPlugin(),
+    new ReactRefreshWebpackPlugin({
+      overlay: false,
+    }),
+  ],
+  module: {
+    rules: [
+      {
+        test: /\.(jsx|ts|tsx|js)$/,
+        use: [
+          {
+            loader: 'babel-loader',
+            options: {
+              sourceType: 'unambiguous',
+              presets: [
+                '@babel/preset-react',
+                [
+                  '@babel/preset-env',
+                  {
+                    targets: {
+                      chrome: 57,
+                      ios: 8,
+                    },
+                  },
+                ],
+              ],
+              plugins: [
+                ['@babel/plugin-proposal-class-properties'],
+                ['@babel/plugin-proposal-decorators', { legacy: true }],
+                ['@babel/plugin-transform-runtime', { regenerator: true }],
+                require.resolve('react-refresh/babel'),
+              ],
+            },
+          },
+        ],
+      },
+      {
+        test: /\.(png|jpe?g|gif)$/i,
+        use: [{
+          loader: 'file-loader',
+          options: {
+            name: '[name].[ext]',
+            outputPath: 'assets/',
+          },
+        }],
+      },
+      {
+        test: /\.css$/,
+        use: ['style-loader', 'css-loader'],
+      },
+    ],
+  },
+  resolve: {
+    extensions: ['.js', '.jsx', '.json'],
+    modules: [path.resolve(__dirname, '../node_modules')],
+    alias: (() => {
+      const aliases = {};
+      // If hippy-react was built exist then make a alias
+      // Remove the section if you don't use it
+      const hippyReactPath = path.resolve(__dirname, '../../../packages/hippy-react');
+      if (fs.existsSync(path.resolve(hippyReactPath, 'dist/index.js'))) {
+        console.warn(`* Using the @hippy/react in ${hippyReactPath}`);
+        aliases['@hippy/react'] = hippyReactPath;
+      } else {
+        console.warn('* Using the @hippy/react defined in package.json');
+      }
+
+      return aliases;
+    })(),
+  },
+};

examples/hippy-react-demo/scripts/hippy-webpack.web.render.js

@@ -0,0 +1,86 @@
+const path = require('path');
+const webpack = require('webpack');
+const HtmlWebpackPlugin = require('html-webpack-plugin');
+const MiniCssExtractPlugin = require('mini-css-extract-plugin');
+const CaseSensitivePathsPlugin = require('case-sensitive-paths-webpack-plugin');
+const pkg = require('../package.json');
+
+const platform = 'web';
+
+module.exports = {
+  mode: 'production',
+  bail: true,
+  entry: {
+    index: ['regenerator-runtime', path.resolve(pkg.web)],
+  },
+  output: {
+    filename: '[name].[contenthash:8].js',
+    path: path.resolve(`./dist/${platform}/`),
+  },
+  plugins: [
+    new webpack.NamedModulesPlugin(),
+    new webpack.DefinePlugin({
+      'process.env.NODE_ENV': JSON.stringify('production'),
+      __PLATFORM__: JSON.stringify(platform),
+    }),
+    new HtmlWebpackPlugin({
+      inject: true,
+      scriptLoading: 'blocking',
+      template: path.resolve('./public/index.html'),
+    }),
+    new MiniCssExtractPlugin({
+      filename: '[name].[hash].css',
+    }),
+    new CaseSensitivePathsPlugin(),
+  ],
+  module: {
+    rules: [
+      {
+        test: /\.(jsx|ts|tsx|js)$/,
+        use: [
+          {
+            loader: 'babel-loader',
+            options: {
+              sourceType: 'unambiguous',
+              presets: [
+                '@babel/preset-react',
+                [
+                  '@babel/preset-env',
+                  {
+                    targets: {
+                      chrome: 57,
+                      ios: 8,
+                    },
+                  },
+                ],
+              ],
+              plugins: [
+                ['@babel/plugin-proposal-class-properties'],
+                ['@babel/plugin-proposal-decorators', { legacy: true }],
+                ['@babel/plugin-transform-runtime', { regenerator: true }],
+              ],
+            },
+          },
+        ],
+      },
+      {
+        test: /\.(png|jpe?g|gif)$/i,
+        use: [{
+          loader: 'file-loader',
+          options: {
+            name: '[name].[ext]',
+            outputPath: 'assets/',
+          },
+        }],
+      },
+      {
+        test: /\.css$/,
+        use: ['style-loader', 'css-loader'],
+      },
+    ],
+  },
+  resolve: {
+    extensions: ['.js', '.jsx', '.json'],
+    modules: [path.resolve(__dirname, '../node_modules')],
+  },
+};