一、ES6模块导入与导出:
具名导出导入
匿名导出导入
模块导出:export { }
具名导出的方式
创建一个js对象
保证以花括号的形式导出
两种方式:
模块导入:<script type="module">
import { } from "Js文件路径 "
具名导入的方式
<script type="module">
保证以花括号的形式导入
当JS文件相有同名字
如果两个js文件有相同的名字:可以选择导入的时候使用as修改变量名
当JS数据有很多的时候
当数据很多的时候,用 * as all 来接收
all代表了所有数据变量 是一个集合
匿名导出:export default{变量数据}
方法一 :
方法二:分开写的导出方式
匿名导入:匿名导出 不需要花括号,名字可任意命名
ES6:如果在匿名导出时,所对应的key值和value值是一样的时候,可以省略value值:
二、node-v下载与应用
1、初始化一个npm项目:npm init
2、快速初始化一个npm项目:
生成的所有的内容都是默认的,命令如下:
文件名称要英文的
快速初始化:npm init -y
3、下载一个最新XXX包依赖 - npm install XXX
①下载一个最新jquery包依赖 - npm install jquery
npm install jquery 简写npm i jquery
文件夹用vscode打开可以看到下载好的JQ 在打包好的文件夹dist里 可以正常使用
②也可以使用bootstrap或vue - npm install bootstrap
文件夹用vscode打开可以看到下载好的bootstrap在打包好的文件夹dist里 可以正常使用
为什么可以使用npm下载依赖包?
因为安装了Node.js
Node相当于是前端的环境
node依赖包的构成:
如果做项目的时候只有文件 没有包依赖无法使用怎么办 - 可以手动下载
如果想要安装指定的版本 需要在npm install的时候删除^
1、安装指定版本的jquery命令:
npm i jquery@1.12.4(指定版本)
2、不知道次版本,只知道主版本可以这样写: 会升级到主版本的最新版本。
npm i jquery@3
各个版本号代表什么意思?例如jquery1.12.4
1代表主版本 主版本之间区别比较大
12代表次版本 做了一个兼容的新增功能
4代表修订号 做了一些兼容修正
生产环境和开发环境
分环境的原因:节约性能
1、安装到生产环境 -- dependencies
npm i bootstrap --save
或写成
npm i bootstrap -S
后面不带任何后缀,默认代表生产环境需要用到的包依赖
2、安装到开发环境 -- devDependencies
npm i moment--save-dev
或者写成:
npm i moment -D
packages.json中会出现下面内容,代表开发环境需要用到包依赖:
如何卸载依赖?-- npm uninstall XXX/npm uni XXX
命令:npm uninstall jquery 或者简写成:npm uni jquery