🐞fix(global): 避免前端打包api相关代码

2234839 · Apr 15, 2021 · e4e674c · e4e674c
1 parent ba073a7
commit e4e674c
Show file tree

Hide file tree

Showing 2 changed files with 166 additions and 165 deletions.
diff --git a/src/rpc.ts b/src/rpc.ts
@@ -6,15 +6,16 @@ type method = keyof apis;
 /** Remote call ， 会就近的选择是远程调用还是使用本地函数 */
 export function RC<K extends method>(
   method: K,
-  data: Parameters<apis[K]>
+  data: Parameters<apis[K]>,
 ): Promise<unPromise<ReturnType<apis[K]>>> {
-  if (typeof window !== "undefined") {
+  //@ts-ignore
+  if (process.browser === true) {
     return fetch("/rpc", {
       method: "POST",
       body: JSON.stringify({ method, data }),
       headers: {
-        "content-type": "application/json"
-      }
+        "content-type": "application/json",
+      },
     }).then((r) => r.json());
   } else {
     //@ts-ignore
@@ -38,8 +39,8 @@ export const API = new Proxy(
   {
     get(target, p: method) {
       return (...arg: any) => RC(p, arg);
-    }
-  }
+    },
+  },
 ) as apisPromiseify;
 
 /** apis 中包含的方法可能不是返回 promise 的，但 RC 调用后的一定是返回 promsie */

diff --git a/webpack.config.js b/webpack.config.js
@@ -1,160 +1,160 @@
-const webpack = require('webpack');
-const config = require('sapper/config/webpack.js');
-const pkg = require('./package.json');
-
-const mode = process.env.NODE_ENV;
-const dev = mode === 'development';
-
-const extensions = ['.ts', '.tsx', '.mjs', '.js', '.json', '.svelte', '.html'];
-const mainFields = ['svelte', 'module', 'browser', 'main'];
-
-const path = require('path');
-const MiniCssExtractPlugin = require('mini-css-extract-plugin');
-const OptimizeCssAssetsPlugin = require('optimize-css-assets-webpack-plugin');
-
-const sveltePreprocess = require('svelte-preprocess');
-
-const preprocess = require("./svelte.config.js");
-
-const sassOptions = {
-  includePaths: [
-    './theme',
-    './node_modules',
-  ]
-};
-
-module.exports = {
-	client: {
-		entry: config.client.entry(),
-		output: config.client.output(),
-		resolve: { 
-			extensions, 
-			mainFields, 
-		},
-		module: {
-			rules: [
-				{
-					test: /\.(svelte|html)$/,
-					use: {
-						loader: 'svelte-loader',
-						options: {
-							preprocess,
-							dev,
-							hydratable: true,
-							hotReload: false // pending https://github.com/sveltejs/svelte/issues/2377
-						}
-					}
-				},
-				{
-					test: /\.(sa|sc|c)ss$/,
-					use: [
-						'style-loader',
-						MiniCssExtractPlugin.loader,
-						'css-loader',
-						{
-							loader: 'sass-loader',
-							options: {
-								sassOptions
-							},
-						},
-					],
-				},
-				{ 
-					test: /\.tsx?$/,
-					loader: "ts-loader"
-				}
-			]
-		},
-		mode,
-		plugins: [
-			// pending https://github.com/sveltejs/svelte/issues/2377
-			// dev && new webpack.HotModuleReplacementPlugin(),
-			new webpack.DefinePlugin({
-				'process.browser': true,
-				'process.env.NODE_ENV': JSON.stringify(mode)
-			}),
-			new MiniCssExtractPlugin({
-				filename: '[name].css',
-				chunkFilename: '[name].[id].css',
-			}),
-			new OptimizeCssAssetsPlugin({
-				assetNameRegExp: /\.css$/g,
-				cssProcessor: require('cssnano'),
-				cssProcessorPluginOptions: {
-					preset: ['default', { discardComments: { removeAll: true } }],
-				},
-				canPrint: true
-			})
-		].filter(Boolean),
-		devtool: dev && 'inline-source-map'
-	},
-
-	server: {
-		entry: config.server.entry(),
-		output: config.server.output(),
-		target: 'node',
-		resolve: { 
-			extensions, 
-			mainFields,
-    },
-		externals: Object.keys(pkg.dependencies).concat('encoding'),
-		module: {
-			rules: [
-				{
-					test: /\.(svelte|html)$/,
-					use: {
-						loader: 'svelte-loader',
-						options: {
-							preprocess,
-							css: false,
-							generate: 'ssr',
-							dev
-						}
-					}
-				},
-				{
-					test: /\.(sa|sc|c)ss$/,
-					use: [
-						'style-loader',
-						MiniCssExtractPlugin.loader,
-						'css-loader',
-						{
-							loader: 'sass-loader',
-							options: {
-								sassOptions
-							},
-						},
-					],
-				},
-				{ 
-					test: /\.tsx?$/,
-					loader: "ts-loader"
-				}
-			]
-		},
-		mode: process.env.NODE_ENV,
-		plugins: [
-			new MiniCssExtractPlugin({
-				filename: '[name].css',
-				chunkFilename: '[name].[id].css',
-			}),
-			new OptimizeCssAssetsPlugin({
-				assetNameRegExp: /\.css$/g,
-				cssProcessor: require('cssnano'),
-				cssProcessorPluginOptions: {
-					preset: ['default', { discardComments: { removeAll: true } }],
-				},
-				canPrint: true
-			})
-		].filter(Boolean),
-		performance: {
-			hints: false // it doesn't matter if server.js is large
-		}
-	},
-
-	serviceworker: {
-		entry: config.serviceworker.entry(),
-		output: config.serviceworker.output(),
-		mode: process.env.NODE_ENV
-	}
+const webpack = require('webpack');
+const config = require('sapper/config/webpack.js');
+const pkg = require('./package.json');
+
+const mode = process.env.NODE_ENV;
+const dev = mode === 'development';
+
+const extensions = [ '.ts', '.tsx', '.mjs', '.js', '.json', '.svelte', '.html' ];
+const mainFields = [ 'svelte', 'module', 'browser', 'main' ];
+
+const path = require('path');
+const MiniCssExtractPlugin = require('mini-css-extract-plugin');
+const OptimizeCssAssetsPlugin = require('optimize-css-assets-webpack-plugin');
+
+const sveltePreprocess = require('svelte-preprocess');
+
+const preprocess = require("./svelte.config.js");
+
+const sassOptions = {
+	includePaths: [
+		'./theme',
+		'./node_modules',
+	]
+};
+
+module.exports = {
+	client: {
+		entry: config.client.entry(),
+		output: config.client.output(),
+		resolve: {
+			extensions,
+			mainFields,
+		},
+		module: {
+			rules: [
+				{
+					test: /\.(svelte|html)$/,
+					use: {
+						loader: 'svelte-loader',
+						options: {
+							preprocess,
+							dev,
+							hydratable: true,
+							hotReload: false // pending https://github.com/sveltejs/svelte/issues/2377
+						}
+					}
+				},
+				{
+					test: /\.(sa|sc|c)ss$/,
+					use: [
+						'style-loader',
+						MiniCssExtractPlugin.loader,
+						'css-loader',
+						{
+							loader: 'sass-loader',
+							options: {
+								sassOptions
+							},
+						},
+					],
+				},
+				{
+					test: /\.tsx?$/,
+					loader: "ts-loader"
+				}
+			]
+		},
+		mode,
+		plugins: [
+			// pending https://github.com/sveltejs/svelte/issues/2377
+			// dev && new webpack.HotModuleReplacementPlugin(),
+			new webpack.DefinePlugin({
+				'process.browser': true,
+				'process.env.NODE_ENV': JSON.stringify(mode)
+			}),
+			new MiniCssExtractPlugin({
+				filename: '[name].css',
+				chunkFilename: '[name].[id].css',
+			}),
+			new OptimizeCssAssetsPlugin({
+				assetNameRegExp: /\.css$/g,
+				cssProcessor: require('cssnano'),
+				cssProcessorPluginOptions: {
+					preset: [ 'default', { discardComments: { removeAll: true } } ],
+				},
+				canPrint: true
+			})
+		].filter(Boolean),
+		devtool: dev && 'inline-source-map'
+	},
+
+	server: {
+		entry: config.server.entry(),
+		output: config.server.output(),
+		target: 'node',
+		resolve: {
+			extensions,
+			mainFields,
+		},
+		externals: Object.keys(pkg.dependencies).concat('encoding'),
+		module: {
+			rules: [
+				{
+					test: /\.(svelte|html)$/,
+					use: {
+						loader: 'svelte-loader',
+						options: {
+							preprocess,
+							css: false,
+							generate: 'ssr',
+							dev
+						}
+					}
+				},
+				{
+					test: /\.(sa|sc|c)ss$/,
+					use: [
+						'style-loader',
+						MiniCssExtractPlugin.loader,
+						'css-loader',
+						{
+							loader: 'sass-loader',
+							options: {
+								sassOptions
+							},
+						},
+					],
+				},
+				{
+					test: /\.tsx?$/,
+					loader: "ts-loader"
+				}
+			]
+		},
+		mode: process.env.NODE_ENV,
+		plugins: [
+			new MiniCssExtractPlugin({
+				filename: '[name].css',
+				chunkFilename: '[name].[id].css',
+			}),
+			new OptimizeCssAssetsPlugin({
+				assetNameRegExp: /\.css$/g,
+				cssProcessor: require('cssnano'),
+				cssProcessorPluginOptions: {
+					preset: [ 'default', { discardComments: { removeAll: true } } ],
+				},
+				canPrint: true
+			})
+		].filter(Boolean),
+		performance: {
+			hints: false // it doesn't matter if server.js is large
+		}
+	},
+
+	serviceworker: {
+		entry: config.serviceworker.entry(),
+		output: config.serviceworker.output(),
+		mode: process.env.NODE_ENV
+	}
 };