Erro com mascara usando Spring Boot | Java | Alura

Galera boa tarde,e stou desenvolvendo um formulario porem nao consigo colocar mascaras no campo, segue exemplo:

<!DOCTYPE html>
<html lang="pt" xmlns="http://www.w3.org/1999/xhtml"
    xmlns:th="http://www.thymeleaf.org"
    xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout"
    layout:decorator="layout/LayoutPadrao">

<head>
    <title>Cadastro de Pacientes</title>
</head>
<body>
<section class="aw-layout-content  js-content" layout:fragment="conteudo">


    <div class="page-header">
        <div class="container-fluid">
            <h1>
                Cadastro de Pacientes
            </h1>
        </div>
    </div>

    <div class="container-fluid">

        <form method="POST" th:object="${paciente}" class="form-vertical  js-form-loading">

            <th:block th:include="fragments/MensagemSucesso"></th:block> 
            <th:block th:include="fragments/MensagensErroValidacao"></th:block>

            <div class="row">    
                <div class="form-group col-sm-8" >
                    <label for="nome">Nome</label>
                    <input id="nome" type="text" class="form-control"/>
                </div>
                <div class="form-group col-sm-4" >
                    <label for="cns">CNS</label>
                    <input id="cns" type="text" class="form-control"/>
                </div>
            </div>

            <div class="row">
                <div class="form-group  col-sm-4">
                    <label>Tipo pessoa</label> 
                    <div>
                        <div class="radio  radio-inline">
                            <input type="radio" id="id_FISICA" class="js-radio-tipo-pessoa" 
                                name="tipoPessoa" data-documento="CPF" data-mascara="000.000.000-00" /> 
                            <label class="control-label" for="id_FISICA">Física</label>
                        </div>
                        <div class="radio  radio-inline">
                            <input type="radio" id="id_JURIDICA" class="js-radio-tipo-pessoa" 
                                name="tipoPessoa" data-documento="CNPJ" data-mascara="00.000.000/0000-00" /> 
                            <label class="control-label" for="id_JURIDICA">Juridica</label>
                        </div>
                    </div>
                </div>

                <div class="form-group  col-sm-8" >
                    <label for="cpfOuCnpj">CPF/CNPJ</label>
                    <input type="text" class="form-control" id="cpfOuCnpj" />
                </div>
            </div>

            <div class="row">    
                <div class="form-group col-sm-6" >
                    <label for="endereco">Endereço</label>
                    <input id="endereco" type="text" class="form-control"/>
                </div>
                <div class="form-group col-sm-2" >
                    <label for="numero">Nº</label>
                    <input id="numero" type="text" class="form-control"/>
                </div>
                <div class="form-group col-sm-4" >
                    <label for="bairro">Bairro</label>
                    <input id="bairro" type="text" class="form-control"/>
                </div>
            </div>

            <div class="row">
                <div class="form-group col-sm-4" >
                    <label for="telefone">Telefone Residêncial</label>
                    <input id="telefone" type="text" class="form-control"/>
                </div>
                <div class="form-group col-sm-4" >
                    <label for="celular">Telefone Celular</label>
                    <input id="celular" type="text" class="form-control"/>
                </div>

            </div>

            <div class="form-group">
                <button class="btn  btn-primary" type="submit">Salvar</button>
                <a href="pesquisa-produtos.html" class="btn  btn-default">Cancelar</a>
            </div>

        </form>
    </div>

</section>

</body>
</html>

Acima o formulario..

Porem o javascrip funciona pois ele me retorna o alerta quando carrego a pagina ... var Brewer = Brewer || {}; alert("ola"); Brewer.MascaraCpfCnpj = (function() {

function MascaraCpfCnpj() { this.radioTipoPessoa = $('.js-radio-tipo-pessoa'); this.labelCpfCnpj = $('[for=cpfOuCnpj]'); this.inputCpfCnpj = $('#cpfOuCnpj'); }

MascaraCpfCnpj.prototype.iniciar = function() { this.radioTipoPessoa.on('change', onTipoPessoaAlterado.bind(this)); }

function onTipoPessoaAlterado(evento) { var tipoPessoaSelecionada = $(evento.currentTarget);

this.labelCpfCnpj.text(tipoPessoaSelecionada.data('documento')); this.inputCpfCnpj.mask(tipoPessoaSelecionada.data('mascara')); this.inputCpfCnpj.val(''); this.inputCpfCnpj.removeAttr('disabled'); }

return MascaraCpfCnpj;

}());

$(function() { var mascaraCpfCnpj = new Brewer.MascaraCpfCnpj(); mascaraCpfCnpj.iniciar(); }); ... Acima é o arquivo de javascript.

PRORROGAMOS O DESCONTO!