Если говорить про ввод телефона пользователем и проверять на валидность, то лучше вот этого я ничего не видел andr-04.github.io/inputmask-multi/ru.html
НО, это не регулярка, а плагин для обработки форм. Возможно именно такой Вам и нужен.

Да, все примеры что есть дают ошибки. Увы!!! Ошибок тьма! Вернее не так, ошибки везде! Вот единственный вариант, где ошибок нет.
webpack.config.js:

const path = require('path');
const MiniCssExtractPlugin = require("mini-css-extract-plugin");

module.exports = {
	entry:     {
		app: './src/index.js',
	},
	output:    {
		filename:   '[name].js',
		path:       path.resolve(__dirname, './dist'),
		publicPath: '/dist'
	},
	module:    {
		rules: [
			{ test:   /\.js$/, loader: 'babel-loader', exclude: /(node_modules|bower_components)/},
			{ test: /\.styl$/,
				use: [
					{loader: MiniCssExtractPlugin.loader, options: {publicPath: '/dist'}},
					{loader: "css-loader"},
					{loader: "stylus-loader"}
				]
			}
		]
	},
	plugins: [
		new MiniCssExtractPlugin({
			filename: "[name].css",
			chunkFilename: "[id].css"
		})
	]
};

package.json:

"devDependencies": {
    "@babel/core": "^7.4.0",
    "@babel/preset-env": "^7.4.2",
    "autoprefixer": "^9.5.0",
    "babel-loader": "^8.0.5",
    "css-loader": "^2.1.1",
    "mini-css-extract-plugin": "^0.5.0",
    "path": "^0.12.7",
    "postcss-loader": "^3.0.0",
    "style-loader": "^0.23.1",
    "stylus": "^0.54.5",
    "stylus-loader": "^3.0.2",
    "webpack": "^4.29.6",
    "webpack-cli": "^3.3.0",
    "webpack-dev-server": "^3.2.1"
  }

Потом когда доделаю свой шаблон, я выложу его на GitHub и дам ссылку.

С точки зрения психологии, нет ничего лучше таблиц.
С точки зрения SEO особой разницы нет.