CMS前端开发(Vue.js 与Webpack研究)
工程结构
根目录下
模块目录
项目开发的逆向跳转Vue
1.基本构建
1.1基本构建
2.Api 下一步的构建
单页面应用介绍
router 文件夹 及 子目录
这个文件夹里的是整个vue项目的路由,vue 是单页面应用的代表,这里面就是设置一个一个组件的地址的文件
Element-UI介绍。
本项目使用Element-UI来构建界面,Element是一套为开发者、设计师和产品经理准备的基于 Vue 2.0 的桌面端组
件库,表格的标签使用的是element-ui
Webpack研究
安装Webpack
使用vue.js开发大型应用需要使用webpack打包工具。Webpack 是一个前端资源的打包工具,它可以将js、image、css等资源当成一个模块进行打包。
好处:
1、模块化开发 程序员在开发时可以分模块创建不同的js件,减少了http的请求次数。 webpack可以实现按需打包,为了避免出
2、 编译typescript、ES6等高级js语法 随着前端技术的强大,开发中可以使用jawebpack可以将打包文件转换成浏览器
3、CSS预编译 webpack允许在开发中使用Sass 和 Les语法编译成浏览器可识别的css语法。
webpack的缺点: 1、配置有些繁琐 2、文档不丰富
安装node.js
webpack基于node.js运行,node.js是JavaScript的运行环境,实质是对Chrome v8引擎进行了封装。
安装NPM
他是node包管理和分发的工具,使用NPM可以对应用的依赖进行管理,NPM 的功能和服务端项目构建工具maven差不多,我们通过npm 可以很方便地下载js库,打包js文件。
前后端请求响应流程