1.0.2 • Published 5 months ago
hmarketing-simple-mask v1.0.2
Маска ввода номера телефона на чистом JS
Простой легкий плагин на нативном JS, предназначен для установки маски ввода в элементе input с помощью кода JavaScript.
Пример webpack.config.js
module.exports = {
entry: './script.js',
output: {
filename: 'script.js',
},
module: {
rules: [
{
test: /\.css$/i,
use: ['style-loader', 'css-loader'],
},
],
},
};Пример package.json
{
"dependencies": {
"hmarketing-simple-mask": "^2.0.0"
},
"devDependencies": {
"css-loader": "^7.1.2",
"style-loader": "^4.0.0",
"webpack": "^5.9.0",
"webpack-cli": "^4.2.0"
},
"scripts": {
"build": "webpack --config webpack.config.js"
}
}Пример index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>Маска ввода номера телефона на чистом JS</title>
</head>
<body>
<div class="container">
<div class="container__item">
<form class="form">
<input class="input tel" type="tel" name="user_phone" value="" placeholder="+7 (ХХХ)-ХХХ-ХХ-ХХ"/>
<button type="button" class="btn btn--primary btn--inside uppercase">Send</button>
</form>
</div>
</div>
<script type="module" src="./dist/script.js"></script>
</body>
</html>Пример script.js
import "hmarketing-simple-mask/css/styles.css"
import { mask } from "hmarketing-simple-mask";
mask();