gulpのタスクの定義の仕方

Question

前提

gulpを使ってみようと思ったが、そうそうに errorが出て挫けそう
1つ目に、gulpについては何もわからないのでとりあえずサイトのソースコードをコピペしてbowsersyncを動かした。
しかし、minetypeが云々でcssとjsが読み込めない。
2つ目に、どうやら書き方が古いらしく、下記のように書き換えてみたもののそもそもタスクとして定義されていないらしい。

実現したいこと

1. 何故か起こるmimetypeのerrorの解決
2. タスクの定義と呼び出し

発生している問題・エラーメッセージ

タスク定義のerror

$ npx gulp bs
[00:13:53] Using gulpfile ファイル名
[00:13:53] Task never defined: bs
[00:13:53] To list available tasks, try running: gulp --tasks

mimetypeのerror

MIME タイプ (“text/html”) の不一致により “~~~” からのリソースがブロックされました (X-Content-Type-Options: nosniff)。
MIME タイプ (“text/html”) の不一致により “~~~” からのリソースがブロックされました (X-Content-Type-Options: nosniff)。

該当のソースコード

// gulpプラグインの読みこみ
const gulp = require("gulp");

// browser-syncのプラグインの読み込み
const browserSync = require("browser-sync");
const { watch } = require("browser-sync");

// タスクの設定
function bs(params) {
	browserSync({
		server: {
			baseDir: "dist/html"
		}
	})
	watch("src/**", function () {
		browserSync.reload();
	})
}

試したこと

• タスクの定義

何をしていいのか

• mimetypeのerror

htmlにtypeの記述

<link rel="stylesheet" href="~~~" type="text/css">

<script src="~~~" type="text/javascript"></script>

補足情報（FW/ツールのバージョンなど）

browser:firefox
editor:vscode

gulp:^4.0.2
browser-sync:^2.27.10

Answer 1

exports.bs = bsを入れないとタスクは登録されません。
また、browser-syncの場合は最後に第一引数で渡される関数をコールして完了通知をする必要があるようです。

MIME タイプ云々のエラーはブラウザが出してるエラーのはずでgulp関係ないすよね？
ファイルが存在しない、あるいはwebサーバーが適切なMIME-typeを設定しなかった時に起こるエラーのようですけど…
そうでしたら提示いただいた情報では何もわからないので答えようがありません。