目录 一.什么是Webpack 二.Webpack安装 1.全局安装 2.安装后查看版本号 三.创建项目 1.初始化项目 2.创建src文件夹 3.src下创建common.js 4.src下创建utils.js 5.src下创建main.js 四.JS打包 1.创建配置文件 2.执行编译命令 3.创建入口页面 4.测试 五.CSS打包 1.安装插件 2.修改webpack.config.js 3.在src文件夹创建style.css 4.修改main.js 5.运行编译命令 6.测试 一.什么…

目录 一.简介 二.使用npm管理项目 1.项目初始化 2.修改npm镜像 3.npm install命令的使用 4.其它命令 一.简介 什么是NPM NPM全称Node Package Manager,是Node.js包管理工具,是全球最大的模块生态系统,里面所有的模块都是开源免费的:也是Node.js的包管理工具,相当于前端的Maven . #在命令提示符输入 npm -v 可查看当前npm版本 npm -v 二.使用npm管理项目 创建npm_pro文件夹 1.项目初始化 #建立一个空文件…

目录 一.锚点的概念 二.路由的作用 三.路由实例 1.复制js资源 2.创建 路由.html 3.引入js 4.编写html 5.编写js 一.锚点的概念 案例:百度百科 特点:单页Web应用,预先加载页面内容 形式:url#锚点 二.路由的作用 Vue.js 路由允许我们通过锚点定义不同的 URL, 达到访问不同的页面的目的,每个页面的内容通过延迟加载渲染出来. 通过 Vue.js 可以实现多视图的单页Web应用(single page web application,SPA) 三.路由实例…

目录 一.ESLint简介 二.启用ESLint 1.ESLint插件安装 2.插件的扩展设置 3.确认开启语法检查 三.ESLint规则说明 1.规则说明 2.语法规则 一.ESLint简介 ESLint 是一个语法规则和代码风格的检查工具,可以用来保证写出语法正确.风格统一的代码. 不管是多人合作还是个人项目,代码规范是很重要的.这样做不仅可以很大程度地避免基本语法错误,也保证了代码的可读性.这所谓工欲善其事,必先利其器,推荐 ESLint+vscode 来写 vue,有种飞一般的感觉. 每…

目录 一.ECMAScript 6 1.什么是 ECMAScript 6 2.ECMAScript 和 JavaScript 的关系 二.基本语法 1.let声明变量 2.const声明常量(只读变量) 3.解构赋值 4.模板字符串 5.声明对象简写 6.定义方法简写 7.对象拓展运算符 8.函数的默认参数 9.箭头函数 一.ECMAScript 6 1.什么是 ECMAScript 6 ECMAScript 6.0(简称 ES6)是 JavaScript 语言的下一代标准, 2015 年 6…

目录 一.vue-element-admin 1.简介 2.安装 二.vue-admin-template 1.简介 2.安装 一.vue-element-admin 1.简介 vue-element-admin是基于element-ui 的一套后台管理系统集成方案. GitHub地址:https://github.com/PanJiaChen/vue-element-admin 项目在线预览:https://panjiachen.gitee.io/vue-element-admin 2.安装…

目录 一.element-ui 二.element-ui实例 1.引入脚本库 2.引入css 3.引入js 4.渲染讲师列表 5.浏览器中运行 一.element-ui element-ui 是饿了么前端出品的基于 Vue.js的 后台组件库,方便程序员进行页面快速布局和构建 官网: http://element-cn.eleme.io/#/zh-CN 二.element-ui实例 1.引入脚本库 在axios_pro文件夹中引入:element-ui\lib 2.引入css 在axios.ht…

目录 一.axios的作用 二.axios实例 1.复制js资源 2.创建 axios.html 3.引入js 4.启动课程中心微服务 5.编写js 6.html渲染数据 7.跨域 8.使用生命周期函数 9.业务分层的简单实现 一.axios的作用 axios是独立于vue的一个项目,可以用于浏览器和node.js中发送ajax请求 二.axios实例 创建axios_pro文件夹 1.复制js资源 vue.min.js axios.min.js 2.创建 axios.html 3.引入js <…

导航 前端工程化(一)---工程基础目录搭建 前端工程化(二)---webpack配置 前端工程化(三)---Vue的开发模式 前端工程化(四)---helloWord 继续上一遍的配置,本节主要记录webpack的配置过程 webpack的基础知识可以参照官方文档:webpack中文官网 一些知识点 目前在我的项目中起到的作用: 1.webpack在前端工程打包过程中起到了什么作用 声明入口(entry):通俗来讲,就是项目的构建过程是从哪开始,指定的是一个或多个js文件.前端开发,都是基于e…

前言 见解有限,如有描述不当之处,请帮忙指出,如有错误,会及时修正. 为什么要梳理这篇文章? 最近恰好被问到这方面的问题,尝试整理后发现,这道题的覆盖面可以非常广,很适合作为一道承载知识体系的题目. 关于这道题目的吐槽暂且不提(这是一道被提到无数次的题,得到不少人的赞同,也被很多人反感),本文的目的是如何借助这道题梳理自己的前端知识体系! 窃认为,每一个前端人员,如果要往更高阶发展,必然会将自己的知识体系梳理一遍, 没有牢固的知识体系,无法往更高处走! 展现形式:本文并不是将所有的知识点列一遍,…