fix: invalid host header issue on codesandbox

.github/contributing.md

@@ -2,6 +2,7 @@
 
 We are more than happy to accept external contributions to the project
 in the form of feedback, bug reports and even better - pull requests :)
+All our CodeSandBox-Samples are [synced-templates](https://codesandbox.io/docs/learn/sandboxes/synced-templates) with our GitHub-repo: they will update automatically, once our repositories main branch got updated.
 
 ## How to contribute
 

examples/find-components/.codesandbox/tasks.json

@@ -0,0 +1,22 @@
+{
+	// These tasks will run in order when initializing your CodeSandbox project.
+	"setupTasks": [
+		{
+			"name": "Install Dependencies",
+			"command": "yarn install"
+		}
+	],
+
+	// These tasks can be run from CodeSandbox. Running one will open a log in the app.
+	"tasks": {
+		"start": {
+			"name": "start",
+			"command": "yarn start",
+			"runAtStart": true,
+			"preview": {
+				// Set 8080 as primary port for task start
+				"port": 8080
+			}
+		}
+	}
+}

examples/find-components/webpack.config.js

@@ -9,6 +9,9 @@ crypto.createHash = algorithm => crypto_orig_createHash(algorithm === 'md4' ? 's
 module.exports = {
   mode: 'development',
   devtool: 'inline-source-map',
+  devServer: {
+		allowedHosts: ['.codesandbox.io', '.csb.app'],
+	},
   context: __dirname,
   entry: './src/index.js',
   plugins: [

examples/five-star/.codesandbox/tasks.json

@@ -0,0 +1,22 @@
+{
+	// These tasks will run in order when initializing your CodeSandbox project.
+	"setupTasks": [
+		{
+			"name": "Install Dependencies",
+			"command": "yarn install"
+		}
+	],
+
+	// These tasks can be run from CodeSandbox. Running one will open a log in the app.
+	"tasks": {
+		"start": {
+			"name": "start",
+			"command": "yarn start",
+			"runAtStart": true,
+			"preview": {
+				// Set 8080 as primary port for task start
+				"port": 8080
+			}
+		}
+	}
+}

examples/five-star/webpack.config.js

@@ -9,6 +9,9 @@ crypto.createHash = algorithm => crypto_orig_createHash(algorithm === 'md4' ? 's
 module.exports = {
   mode: 'development',
   devtool: 'inline-source-map',
+  devServer: {
+		allowedHosts: ['.codesandbox.io', '.csb.app'],
+	},
   context: __dirname,
   entry: './src/index.js',
   module: {

examples/get-component-by-dom-node/.codesandbox/tasks.json

@@ -0,0 +1,22 @@
+{
+	// These tasks will run in order when initializing your CodeSandbox project.
+	"setupTasks": [
+		{
+			"name": "Install Dependencies",
+			"command": "yarn install"
+		}
+	],
+
+	// These tasks can be run from CodeSandbox. Running one will open a log in the app.
+	"tasks": {
+		"start": {
+			"name": "start",
+			"command": "yarn start",
+			"runAtStart": true,
+			"preview": {
+				// Set 8080 as primary port for task start
+				"port": 8080
+			}
+		}
+	}
+}

examples/get-component-by-dom-node/webpack.config.js

@@ -9,6 +9,9 @@ crypto.createHash = algorithm => crypto_orig_createHash(algorithm === 'md4' ? 's
 module.exports = {
   mode: 'development',
   devtool: 'inline-source-map',
+  devServer: {
+		allowedHosts: ['.codesandbox.io', '.csb.app'],
+	},
   context: __dirname,
   entry: './src/index.js',
   plugins: [

examples/gondel-react/.codesandbox/tasks.json

@@ -0,0 +1,22 @@
+{
+	// These tasks will run in order when initializing your CodeSandbox project.
+	"setupTasks": [
+		{
+			"name": "Install Dependencies",
+			"command": "yarn install"
+		}
+	],
+
+	// These tasks can be run from CodeSandbox. Running one will open a log in the app.
+	"tasks": {
+		"start": {
+			"name": "start",
+			"command": "yarn start",
+			"runAtStart": true,
+			"preview": {
+				// Set 8080 as primary port for task start
+				"port": 8080
+			}
+		}
+	}
+}

examples/gondel-react/webpack.config.js

@@ -9,6 +9,9 @@ crypto.createHash = algorithm => crypto_orig_createHash(algorithm === 'md4' ? 's
 module.exports = {
   mode: 'development',
   devtool: 'inline-source-map',
+  devServer: {
+		allowedHosts: ['.codesandbox.io', '.csb.app'],
+	},
   context: __dirname,
   entry: './src/index.ts',
   module: {

examples/hello-world/.codesandbox/tasks.json

@@ -0,0 +1,22 @@
+{
+	// These tasks will run in order when initializing your CodeSandbox project.
+	"setupTasks": [
+		{
+			"name": "Install Dependencies",
+			"command": "yarn install"
+		}
+	],
+
+	// These tasks can be run from CodeSandbox. Running one will open a log in the app.
+	"tasks": {
+		"start": {
+			"name": "start",
+			"command": "yarn start",
+			"runAtStart": true,
+			"preview": {
+				// Set 8080 as primary port for task start
+				"port": 8080
+			}
+		}
+	}
+}

examples/hello-world/webpack.config.js

@@ -9,6 +9,9 @@ crypto.createHash = algorithm => crypto_orig_createHash(algorithm === 'md4' ? 's
 module.exports = {
   mode: 'development',
   devtool: 'inline-source-map',
+  devServer: {
+		allowedHosts: ['.codesandbox.io', '.csb.app'],
+	},
   context: __dirname,
   entry: './src/index.js',
   plugins: [

examples/lazy-load/.codesandbox/tasks.json

@@ -0,0 +1,22 @@
+{
+	// These tasks will run in order when initializing your CodeSandbox project.
+	"setupTasks": [
+		{
+			"name": "Install Dependencies",
+			"command": "yarn install"
+		}
+	],
+
+	// These tasks can be run from CodeSandbox. Running one will open a log in the app.
+	"tasks": {
+		"start": {
+			"name": "start",
+			"command": "yarn start",
+			"runAtStart": true,
+			"preview": {
+				// Set 8080 as primary port for task start
+				"port": 8080
+			}
+		}
+	}
+}

examples/lazy-load/webpack.config.js

@@ -9,6 +9,9 @@ crypto.createHash = algorithm => crypto_orig_createHash(algorithm === 'md4' ? 's
 module.exports = {
   mode: 'development',
   devtool: 'inline-source-map',
+  devServer: {
+		allowedHosts: ['.codesandbox.io', '.csb.app'],
+	},
   context: __dirname,
   entry: './src/index.js',
   plugins: [

examples/plugin-data/.codesandbox/tasks.json

@@ -0,0 +1,22 @@
+{
+	// These tasks will run in order when initializing your CodeSandbox project.
+	"setupTasks": [
+		{
+			"name": "Install Dependencies",
+			"command": "yarn install"
+		}
+	],
+
+	// These tasks can be run from CodeSandbox. Running one will open a log in the app.
+	"tasks": {
+		"start": {
+			"name": "start",
+			"command": "yarn start",
+			"runAtStart": true,
+			"preview": {
+				// Set 8080 as primary port for task start
+				"port": 8080
+			}
+		}
+	}
+}

examples/plugin-data/webpack.config.js

@@ -9,6 +9,9 @@ crypto.createHash = algorithm => crypto_orig_createHash(algorithm === 'md4' ? 's
 module.exports = {
   mode: 'development',
   devtool: 'inline-source-map',
+  devServer: {
+		allowedHosts: ['.codesandbox.io', '.csb.app'],
+	},
   context: __dirname,
   entry: './src/index.ts',
   plugins: [

examples/plugin-media-query/.codesandbox/tasks.json

@@ -0,0 +1,22 @@
+{
+	// These tasks will run in order when initializing your CodeSandbox project.
+	"setupTasks": [
+		{
+			"name": "Install Dependencies",
+			"command": "yarn install"
+		}
+	],
+
+	// These tasks can be run from CodeSandbox. Running one will open a log in the app.
+	"tasks": {
+		"start": {
+			"name": "start",
+			"command": "yarn start",
+			"runAtStart": true,
+			"preview": {
+				// Set 8080 as primary port for task start
+				"port": 8080
+			}
+		}
+	}
+}

examples/plugin-media-query/webpack.config.js

@@ -9,6 +9,9 @@ crypto.createHash = algorithm => crypto_orig_createHash(algorithm === 'md4' ? 's
 module.exports = {
   mode: 'development',
   devtool: 'inline-source-map',
+  devServer: {
+		allowedHosts: ['.codesandbox.io', '.csb.app'],
+	},
   context: __dirname,
   entry: './src/index.js',
   plugins: [

examples/plugin-resize/.codesandbox/tasks.json

@@ -0,0 +1,22 @@
+{
+	// These tasks will run in order when initializing your CodeSandbox project.
+	"setupTasks": [
+		{
+			"name": "Install Dependencies",
+			"command": "yarn install"
+		}
+	],
+
+	// These tasks can be run from CodeSandbox. Running one will open a log in the app.
+	"tasks": {
+		"start": {
+			"name": "start",
+			"command": "yarn start",
+			"runAtStart": true,
+			"preview": {
+				// Set 8080 as primary port for task start
+				"port": 8080
+			}
+		}
+	}
+}

examples/plugin-resize/webpack.config.js

@@ -9,6 +9,9 @@ crypto.createHash = algorithm => crypto_orig_createHash(algorithm === 'md4' ? 's
 module.exports = {
   mode: 'development',
   devtool: 'inline-source-map',
+  devServer: {
+		allowedHosts: ['.codesandbox.io', '.csb.app'],
+	},
   context: __dirname,
   entry: './src/index.js',
   plugins: [

examples/react-gondel/.codesandbox/tasks.json

@@ -0,0 +1,22 @@
+{
+	// These tasks will run in order when initializing your CodeSandbox project.
+	"setupTasks": [
+		{
+			"name": "Install Dependencies",
+			"command": "yarn install"
+		}
+	],
+
+	// These tasks can be run from CodeSandbox. Running one will open a log in the app.
+	"tasks": {
+		"start": {
+			"name": "start",
+			"command": "yarn start",
+			"runAtStart": true,
+			"preview": {
+				// Set 8080 as primary port for task start
+				"port": 8080
+			}
+		}
+	}
+}

examples/react-gondel/webpack.config.js

@@ -9,6 +9,9 @@ crypto.createHash = algorithm => crypto_orig_createHash(algorithm === 'md4' ? 's
 module.exports = {
   mode: 'development',
   devtool: 'inline-source-map',
+  devServer: {
+		allowedHosts: ['.codesandbox.io', '.csb.app'],
+	},
   context: __dirname,
   entry: './src/index.js',
   plugins: [

examples/trigger-public-event/.codesandbox/tasks.json

@@ -0,0 +1,22 @@
+{
+	// These tasks will run in order when initializing your CodeSandbox project.
+	"setupTasks": [
+		{
+			"name": "Install Dependencies",
+			"command": "yarn install"
+		}
+	],
+
+	// These tasks can be run from CodeSandbox. Running one will open a log in the app.
+	"tasks": {
+		"start": {
+			"name": "start",
+			"command": "yarn start",
+			"runAtStart": true,
+			"preview": {
+				// Set 8080 as primary port for task start
+				"port": 8080
+			}
+		}
+	}
+}

examples/trigger-public-event/webpack.config.js

@@ -9,6 +9,9 @@ crypto.createHash = algorithm => crypto_orig_createHash(algorithm === 'md4' ? 's
 module.exports = {
   mode: 'development',
   devtool: 'inline-source-map',
+  devServer: {
+		allowedHosts: ['.codesandbox.io', '.csb.app'],
+	},
   context: __dirname,
   entry: './src/index.js',
   plugins: [

examples/typescript/.codesandbox/tasks.json

@@ -0,0 +1,22 @@
+{
+	// These tasks will run in order when initializing your CodeSandbox project.
+	"setupTasks": [
+		{
+			"name": "Install Dependencies",
+			"command": "yarn install"
+		}
+	],
+
+	// These tasks can be run from CodeSandbox. Running one will open a log in the app.
+	"tasks": {
+		"start": {
+			"name": "start",
+			"command": "yarn start",
+			"runAtStart": true,
+			"preview": {
+				// Set 8080 as primary port for task start
+				"port": 8080
+			}
+		}
+	}
+}