JS中bootstrap和jquery引入

版权声明:进击的葱 https://blog.csdn.net/qlwangcong518/article/details/86032763

1.在网络的情况下,启动webstorm中的Terminal,输入(黑体字)

 

F:\A-H5-GP9\test>npm i [email protected]

npm WARN saveError ENOENT: no such file or directory, open 'F:\A-H5-GP9\test\package.json'

npm notice created a lockfile as package-lock.json. You should commit this file.

npm WARN enoent ENOENT: no such file or directory, open 'F:\A-H5-GP9\test\package.json'

npm WARN test No description

npm WARN test No repository field.

npm WARN test No README data

npm WARN test No license field.

 

+ [email protected]

added 1 package in 6.441s

 

F:\A-H5-GP9\test>npm i jquery

npm WARN saveError ENOENT: no such file or directory, open 'F:\A-H5-GP9\test\package.json'

npm WARN enoent ENOENT: no such file or directory, open 'F:\A-H5-GP9\test\package.json'

npm WARN test No description

npm WARN test No repository field.

npm WARN test No README data

npm WARN test No license field.

 

+ [email protected]

added 1 package in 4.051s

 

2.完成对bootstrapjquery的获取 上述

当我们输入上述两行后,会自动下载,然后记得相应的路径不要错误。

 

3.引入文件

 

<linkhref="node_modules/bootstrap/dist/css/bootstrap-theme.css"rel="stylesheet">

<scriptsrc="node_modules/jquery/dist/jquery.js"></script>

<scriptsrc="node_modules/bootstrap/dist/js/bootstrap.js"></script>

 

测试:

<!DOCTYPEhtml>

<htmllang="en">

<head>

<metacharset="UTF-8">

<title>Title</title>

<!--前期准备工作-->

<linkhref="node_modules/bootstrap/dist/css/bootstrap-theme.css"rel="stylesheet">

<scriptsrc="node_modules/jquery/dist/jquery.js"></script>

<scriptsrc="node_modules/bootstrap/dist/js/bootstrap.js"></script>

</head>

<body>

<buttonclass="btnbtn-default">XBL</button>

</body>

</html>

 

4.效果

 

猜你喜欢

转载自blog.csdn.net/qlwangcong518/article/details/86032763