mobile模块化js⽂件node
1.为甚么要⽤模块(包)
1.1</script src="js/xxx.js"></script>
整个页⾯只写⼀个js⽂件，所有特效都写在⾥⾯了
缺点：耦合度太⾼，代码关联性太强，不利于后期维护，造成全局污染
<script src="js/xxx1.js"></script>
<script src="js/xxx2.js"></script>
<script src="js/xxx3.js"></script>
页⾯链多个js⽂件，特效都在⾥⾯
缺点：发⽣请求过多，依赖模糊，难于维护
以上传统开发形式都被抛弃了
2.模块化开发
2.1 概念:node⾃带的规范commoujs规范
gold open access是什么意思 2.2 规范：运⾏在服务端，不是浏览器端，如果使⽤在浏览器端，需要使⽤该⽂件进⾏打包预编译
(借鉴⼯具browserify,webpack,gulp等)
2.3 优点：减少代码之间关联度部署⽅便，更好的分离按需加载避免命名冲突容易维护
书写模块的时候，对外暴露接⼝ ports={} =
2.4 引⼊模块⽅法
require(我是主⽂件路径)
2.5 CommonJS
CommonJS暴露的是⼀个名字叫exports的对象
Commonjs是node的规范，但他是同步加载的，同步加载在浏览器端是⼀个坑，只要⼀个环节卡住了，后⾯的就没法执⾏。所以不建议使⽤，如果⾮要使⽤就需要编辑打包。
2.6 Web端
每个js都是⼀个模块，每个模块都必须有⼀个暴露接⼝，每个js⽂件有⼀个全局的⽅法叫require()⽤于引⼊模块。
2.7 exports和ports概念以及区别:
， module是⼀个变量，指向⼀块内存，exports是module中的⼀个属性，存储在内存中，然后exports属性指向{}模块
exports:⾸先对于本⾝来讲是⼀个变量（对象），它不是module的引⽤，它是{}的引⽤，它指向ports的{}模块
exports只能使⽤.语法向外暴露内部变量例 =xxx;
ports既可以通过点语法，也可以直接赋值⼀个对象例 =xxx; ports=xxx;
⼆者本质⼀样，都是暴露⼀个exports对象
2.8 模块
2.第三⽅模块 weui jquery axios zepto
Npm 全名 node packsge manager node包管理⼯具增删查改
如果npm操作太慢
可以安装npm镜像 : npm install -g cnpm --registry=registry.
2.9下载安装
Npm install jquery
下载存放的位置
全局下载在任何⼀个⽂件夹下都能使⽤这个包全局安装⽬录
卫仕猫粮现尼龙碎片C:\Users\Administrator\AppData\Roaming\npm\node_modules
如何全局安装
Npm install -g jquery
局部安装
Npm install jquery
就会在当前⽬录下⽣成⼀个node_modules的⽂件夹⾥⾯
Npm install jquery --save
这个是下载运⾏环境(⽣产环境)的包⽐如 jquery
Npm install jquery --save -dev
这个是下载开发环境所以来的包------- ⽐如 npm browserify
⼆者区别
前者--save 是上线时会被压缩的包
后者--save-dev是上线时会被抛弃的包
dependencies---- ⽣产环境下的包(模块)
devDependencies------开发环境下的包的说明
3.0增删查改
增--指定版本下载 npm install jquery@3.2.2 --- save
删--npm uninstaall jquery
查--npm seacrch jquery
改(更新)--npm updata jquery
3⾃定义模块化(我们写的)
配置模块说明⽂件 npm init 就会⽣成⼀个名为package.json的⽂件
{
" name":"xxxx",
"version":""1.0.0",
"description":"study",
"main":index.js",
"script:":{
"test":"echo\"Error:no test specified\" && exit 1 "python typedef用法
},
"author":"",
"license":"ISC"
}
main:index ----- 我们的主⽂件是index.js
index.js 是这个包的输出⽂件，即便删除了package.json 只要不改变index的js的⽂件名就没事
,⼀旦改了就报错.是因为包的输出⽂件默认是index.js
var obj = require("默认在node_modules下这个包");
在浏览器端，说require is not defined 说明浏览器不⽀持commoujs，需要借鉴打包⼯具(browserify)
4.Node
Node是javascript的环境，在node⾥⾯可以运⾏js⽂件。指令 node ⽂件名
Mobile
1，模块===包
传统开发：整个⽹页我们写了⼀个js⽂件，所有的特效都写在⾥⾯了。
缺点：耦合度太⾼，代码关联性太强，不便于后期维护，会造成全局污染。
发⽣的请求次数过多，依赖模糊，难于维护。
以上都是传统的开发形式，都被抛弃了。
2. 使⽤模块化开发
为什么使⽤模块化？
减少代码之间的关联度，部署⽅便，更好的分离按需加载，避免命名冲突，容易维护。
3. 什么是模块化？
Node⾃带的规范 commonjs规范
Commonjs是node的规范，运⾏在服务端，不是浏览器端，如果使⽤在浏览器端，需要使⽤对该⽂件进⾏打包编译（借鉴⼯具browserify，webpack，gulp等）
书写模块的时候，对外暴露接⼝ ports={} =
jquery下载文件请求引⼊模块 require(路径)
Commonjs暴露的本质是⼀个叫exports的对象
⼆者暴露的本质是⼀样的，都是暴露⼀个exports对象
Commonjs是node的规范，但他是同步加载的，同步加载在浏览器端是⼀个坑，只要⼀个环节卡住了，后⾯的就没法执⾏。所以不建议使⽤，如果⾮要使⽤就需要编辑打包。Web端
每个js都是⼀个模块，每个模块都必须有⼀个暴露接⼝，每个js⽂件有⼀个全局的⽅法叫require()⽤于引⼊模块。
模块
2.第三⽅模块 weui jquery axios zepto
Npm 全名 node packsge manager node包管理⼯具增删查改
www.npmjs/
如果npm操作太慢
可以安装npm镜像
npm install -g cnpm --registry=registry.
下载
Npm install jquery
下载存放的位置
全局下载在任何⼀个⽂件夹下都能使⽤这个包全局安装⽬录
C:\Users\Administrator\AppData\Roaming\npm\node_modules
如何全局安装
Npm install -g jquery
局部安装
Npm install jquery
就会在当前⽬录下⽣成⼀个node_modules的⽂件夹⾥⾯
Npm install jquery --save
autowired
这个是下载运⾏环境(⽣产环境)的包⽐如 jquery
Npm install jquery --save -dev
这个是下载开发环境所以来的包⽐如npm browserify
⼆者区别
前者--save 是上线时会被压缩的包后者--save-dev是上线时会被抛弃的包
指定版本下载
Npm install jquery@3.2.1 --save
删除
Npm uninstall jquery
查版本
Npm search jquery
html语言有哪些特点
更新
Npm updata jquery
3.⾃定义模块我们写的
1.配置模块说明⽂件 npm init 就会⽣成⼀个package.json的⽂件
main：index.js 我们的主⽂件是index.js
Index.js是这个包的输出⽂件，即便删除了package.json只要不改变index.js的⽂件名就没事，⼀旦改了就报错。是因为包的输出⽂件默认是index.js 2.var obj=require("cui")
默认在node_modules⽂件夹下这个包
在浏览器端，说require is not defined 说明浏览器不⽀持commonjs，需要借鉴打包⼯具
1.browserify
npm install -g browserify
2.
Node
Node是javascript的环境，在node⾥⾯可以运⾏js⽂件。指令 node ⽂件名
版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。
发表评论