摘要:
7.ajax函数封装 7.1.实例引入 需求: 每秒钟请求一次服务器 获取到数据 实现: 把ajax进行封装 7.2.ajax代码,普通封装: 7.3.ajax代码,封装成对象的传参的形式: 阅读全文
摘要:
5.ajax简介 5.1.什么是ajax Asynchronous JavaScript and XML ,异步的javascript和XML 5.2.使用ajax有什么用 数据交互,可以从服务器获取到数据,也可以从前台把数据发送到后台服务器 5.3.如何使用ajax 5.3.1 ajax程序流程 阅读全文
摘要:
4.JSON 4.1 什么是JSON? JavaScript 对象表示法(JavaScript Object Notation)简称JSON,是一种轻量级的数据交换格式。虽然它基于JavaScript的对象字面量表示法,但是它于语言却是无关的,这里说的无关意思是说没有依赖关系,不是说只有在js中才能 阅读全文
摘要:
3.HTTP服务器 3.3.相关前置知识 1 什么是url? 统一资源定位符是对可以从互联网上得到的资源的位置和访问方法的一种简洁的表示,是互联网上标准资源的地址。互联网上的每个文件都有一个唯一的URL,它包含的信息指出文件的位置以及浏览器应该怎么处理它 2 url包含的内容 url的形式是这样的: 阅读全文
摘要:
2.NPM使用 2.1.NPM是什么 NPM的全称是Node Package Manager,是一个NodeJS包管理和分发工具,这里要搞清楚包的概念,通俗的说,包就是具有一定功能的工具(软件),本质上呢这些包就是很多文件的集合,例如下图就是一个包: 这个包的作用就是将ES6的代码转换成ES5的代码 阅读全文
摘要:
1.Node.js简介 1.0.前后台数据交互流程 在web开发中,我们经常听说前端和后台,他们分别是做什么具体工作的呢?他们怎样交互的呢?我们得把这些基础的问题都搞明白了,才有一个大致的学习方向,首先,我们来看一张生活中几乎每个人都经历过的一个场景,如下图: 当你去餐馆吃饭的时候,坐下后服务员会带 阅读全文
摘要:
10.css模块化 10.1.什么是css模块? CSS模块就是所有的类名都只有局部作用域的CSS文件,当你在一个JavaScript模块中导入一个CSS文件时,CSS模块将会定义一个对象,将文件中类的名字动态的映射为JavaScript作用域中可以使用的字符串,CSS模块不是浏览器中的官方标准(o 阅读全文
摘要:
9.路径相关 原来我们打包的东西都存放到了dist目录下,并没有进行分类存储,乱成一团,这一节我们就要处理一下打包的路径,让打包后的目录看起来更加优雅 9.1.代码准备 我们先建立起这样一个目录结构 你只需要把前面我们写的代码copy一份,然后删除掉dist里面的东西并且在src下新建assets文 阅读全文
摘要:
8.babel相关 8.1.babel是什么? Babel 是一个 JavaScript 编译器,它使用非常广泛,可以将es6转换成es5,从而在一些不支持es6的浏览器中运行,这意味着你写es6代码的时候就不需要去关心浏览器是否支持es6 点击进入babel中文地址 点击进入babel官方地址 8 阅读全文
摘要:
7.使用字体 7.1.安装字体库-font-awesome 我们通过npm来安装字体 这个时候,我们的package.json配置文件变成这样: 注意:我们在安装第三方包的时候,可以使用下面两条命令 以及 这两条命令的区别是,--save 安装的是项目依赖,会把当前安装的包一起打包随着项目发布到线上 阅读全文
摘要:
6.使用图片 6.1.尝试在css中引入图片 在src目录下新建css文件夹,并且在css文件夹下创建app.css文件,在src目录下新建images文件夹,放入一张图片,在app.css中引入这张图片 在命令行中通过 npm start运行,查看结果,命令行中会报以下错误 通过报错信息,我们大体 阅读全文
摘要:
5.loader 5.1.什么是loader? loader 让 webpack 能够去处理那些非 JavaScript 文件(webpack 自身只理解 JavaScript)。loader 可以将所有类型的文件转换为 webpack 能够处理的有效模块,然后你就可以利用 webpack 的打包能 阅读全文
摘要:
4.devserver webpack-dev-server 为你提供了一个简单的 web 服务器,并且能够实时重新加载(live reloading)。 4.1.安装webpack-dev-server 修改package.json配置文件,在script选项中加入下面代码: 整个package. 阅读全文
摘要:
3.插件 在前端迅速发展的今天,许多没有太多技术含量并且感觉是在浪费时间的事情,就可以交给构建工具来做,例如:我们去手动创建index.html,手动引入打包好的js文件等操作,都可以叫个webpack来做,帮助我们提升效率,因此,你只需要理解,插件其实就是webpack的一些扩展功能,旨在帮助我们 阅读全文
摘要:
2.初识打包 2.1 项目初始化 1.创建一个目录,并且切换到目录下面 2.npm初始化并本地安装webpack 3.在webpack-demo目录下创建对应的目录和文件 4.index.js 文件内容 5.module1.js文件内容 6.module2.js文件内容 7.module3.js文件 阅读全文
摘要:
1.webpack简介 webpack 是一个现代 JavaScript 应用程序的模块打包器(module bundler)。它可以将许多松散的模块按照依赖和规则打包成符合生产环境部署的前端资源 1.1.1.webpack安装 在安装webpack之前你需要先安装Node.js,最理想的Node. 阅读全文