How to call the bootstrap module on the html page in a Node project?

Asked

Viewed 4,982 times

1

I’m using the Node and lowered the dependence on bootstrap, but I don’t know how,call it on the index.html page, to use the bootstrap.min.css file, what should I do?
I have the following directory structure:

----aprendendo 
    ---- config
        ---- express.js 
    ---- node_modules
        ---- bootstrap
        ---- express
    ---- public
        ---- index.html
        ---- outrasPaginas.html
    ---- package.json
    ---- server.js

1 answer

1

Bootstrap is a library to be used on the client, regardless of whether you are using Node or not. The included standard template on the official website illustrates well:

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <!-- As três tags meta acima *precisam* serem as primeiras na head; qualquer outro conteúdo deve vir *depois* dessas tags -->

    <title>Modelo do tutorial do Bootstrap</title>

    <!-- Bootstrap -->
    <link href="css/bootstrap.min.css" rel="stylesheet">

    <!-- shim HTML5 and Respond.js para o suporte do IE8 a elementos HTML5 e media queries -->
    <!-- ATENÇÃO: Respond.js não funciona se você visualizar a página pelo file:// -->
    <!--[if lt IE 9]>
      <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
      <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
    <![endif]-->
  </head>
  <body>
    <h1>Hello, world!</h1>

    <!-- jQuery (necessário para os plugins Javascript do Bootstrap) -->
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
    <!-- Inclua todos os plugins compilados (abaixo), ou inclua um por um quando for necessário -->
    <script src="js/bootstrap.min.js"></script>
  </body>
</html>

Note that this example assumes that the bootstrap.min.css file is inside the css folder, and that folder is in the same directory as this HTML file. Adjust according to your case (search if you need to find out where your file went). Same thing with bootstrap.js file.

  • Thank you first of all! I forgot to edit the question , the content of your answer is already known to me and I do this for a while!! My doubt is like using the Power to do this for min!! Sorry I will edit the question!!

Browser other questions tagged

You are not signed in. Login or sign up in order to post.