Vue实例:vue2.0+ElementUI框架开发pc项目
开发前准备
- vue.js2.0中文,项目所使用的js框架
- vue-router,vue.js配套路由
- vuex,状态管理
- Element,UI框架
1,根据官方指引,构建项目框架
安装vue
npm install vue@2.1.6 全局安装 vue-cli
npm install --global vue-cli 创建一个基于 webpack 模板的新项目my-project
vue init webpack my-project 进入项目目录
cd my-project 安装依赖,走你
npm install 运行项目
npm run dev
2,使用webpack+ sass 来写css
less是一门css预处理语言,它是拓展了css,增加了变量,Mixin等等。使用sass需要安装sass服务,sass-loader用来打包时用,
想要将sass正确解析成css当然还需要style-loader和css-loader。loader是webpack重要的功能之一,通过使用不同的loader,
webpack可以使用外部脚本或工具处理不同格式类型的文件,如通过sass-loader处".sass"文件。
首先安装:
npm install sass --save-dev
npm install style-loader css-loader sass-loader --save-dev
3,LESS/Sass 编译工具Koala介绍
koala是一个国产免费前端预处理器语言图形编译工具,支持Less、Sass、Compass、CoffeeScript,帮助web开发者更高效地使用它们进行开发。跨平台运行,完美兼容windows、linux、mac。

转载:https://www.jianshu.com/p/d87d7140944e/ vue入门 | 使用vue.js2.0 + ElementUI开发后台管理系统详细教程
https://www.cnblogs.com/chen-cong/p/8323958.html webpack---less+热更新 使用
Vue实例:vue2.0+ElementUI框架开发pc项目的更多相关文章
- 从壹开始前后端分离【 .NET Core2.0 +Vue2.0 】框架之七 || API项目整体搭建 6.2 轻量级ORM
更新 1.在使用的时候,特别是更新数据的时候,如果不知道哪里有问题,可以查看数据库 和 实体类 的字段,是否大小写一致,比如 name 和 Name 2.在使用Sqlsugar 的 CodeFirst ...
- Z从壹开始前后端分离【 .NET Core2.2/3.0 +Vue2.0 】框架之七 || API项目整体搭建 6.2 轻量级ORM
本文梯子 本文3.0版本文章 前言 零.今天完成的蓝色部分 0.创建实体模型与数据库 1.实体模型 2.创建数据库 一.在 IRepository 层设计接口 二.在 Repository 层实现相应 ...
- 从壹开始前后端分离【 .NET Core2.0 +Vue2.0 】框架之六 || API项目整体搭建 6.1 仓储模式
前言 1.@LearningCoding 小伙伴关于用Sqlsugar在mysql数据库上的研究成果: sqlsugarcore支持mysql等数据库,在DbContext里面只需要设置dbtype为 ...
- Z从壹开始前后端分离【 .NET Core2.2/3.0 +Vue2.0 】框架之六 || API项目整体搭建 6.1 仓储+服务+抽象接口模式
本文梯子 本文3.0版本文章 前言 零.完成图中的粉色部分 2019-08-30:关于仓储的相关话题 一.创建实体Model数据层 二.设计仓储接口与其实现类 三.设计服务接口与其实现类 四.创建 C ...
- 从壹开始前后端分离【 .NET Core2.0 +Vue2.0 】框架之八 || API项目整体搭建 6.3 异步泛型仓储+依赖注入初探
代码已上传Github+Gitee,文末有地址 番外:在上文中,也是遇到了大家见仁见智的评论和反对,嗯~说实话,积极性稍微受到了一丢丢的打击,不过还好,还是有很多很多很多人的赞同的,所以会一直坚持下去 ...
- Z从壹开始前后端分离【 .NET Core2.2/3.0 +Vue2.0 】框架之八 || API项目整体搭建 6.3 异步泛型仓储+依赖注入初探
本文梯子 本文3.0版本文章 回顾 1.Sqlsugar 的使用 2.修改数据连接字符串 今天要完成的浅紫色部分 一.设计仓储基类接口——IBaseRepository.cs 二.将其他的仓储接口,继 ...
- Vuejs+elementUI框架开发的项目结构及文件关系
项目结构|----- build #webpack编译相关文件目录,一般不用动 |----- config #配置目录| |------ dev.env.js #开发环境变量| |-- ...
- vue 专题 vue2.0各大前端移动端ui框架组件展示
Vue 专题 一个数据驱动的组件,为现代化的 Web 界面而生.具有可扩展的数据绑定机制,原生对象即模型,简洁明了的 API 组件化 UI 构建 多个轻量库搭配使用 请访问链接: https://ww ...
- Vue2.0+ElementUI+PageHelper实现的表格分页
Vue2.0+ElementUI+PageHelper实现的表格分页 前言 最近做了一些前端的项目,要对表格进行一些分页显示.表格分页的方法有很多,从宏观上来说分为物理分页和逻辑分页,由于逻辑分页(即 ...
随机推荐
- 浏览器是如何处理页面元素的Download?
首先,浏览器对于script的下载是避免并行进行的.HTTP/1.1协议中规定浏览器和同一host之间只建立最多两个连接,也就是说允许的最 大并行度为2(当然,对IE和Firefox来说,你都可以通过 ...
- [Java]手动构建表达式二叉树,求值,求后序表达式
Inlet类,这颗二叉树是”人力运维“的: package com.hy; public class Inlet { public static void main(String[] args) th ...
- Mac/Linux 编译安装redis
一.下载安装 官网http://redis.io/ 下载最新的稳定版本,这里是3.2.0 sudu mv redis-.tar /usr/local/ sudo tar -zxf redis-.tar ...
- python 学习笔记(一):在列表、字典、集合中根据条件筛选数据
一.在列表中筛选数据 在列表中筛选出大于等于零的数据,一般通用的用法代码如下: data = [3, -9, 0, 1, -6, 3, -2, 8, -6] #要筛选的原始数据列表 result = ...
- Idea Debug多线程不进断点问题处理
Idea也会使我狼狈不堪,Eclipse下约定成俗,却非Idea的默认规则. 比如 DEBUG多个线程时,Idea的默认设定就会遇到断点不能进入的问题. 解决的方法: 点击DEBUF框下的双红点(Vi ...
- Maven打包时出现无法下载org.apache.maven.plugins插件
解决方式: 方式1:使用 mvn clean package -U 打包即可(注意:出于性能原因,Maven缓存插件无法下载的信息.根据您的设置,您可能需要通过将标志添加-U到命令行来清除此缓存,以使 ...
- [LeetCode] 697. Degree of an Array 数组的度
Given a non-empty array of non-negative integers nums, the degree of this array is defined as the ma ...
- Golang中基础的命令行模块urfave/cli
前言相信只要部署过线上服务,都知道启动参数一定是必不可少的,当你在不同的网络.硬件.软件环境下去启动一个服务的时候,总会有一些启动参数是不确定的,这时候就需要通过命令行模块去解析这些参数,urfave ...
- 大容量类Redis存储--Pika介绍
嘉宾介绍 大家好,首先自我介绍一下,我是360 web平台-基础架构组的宋昭,负责大容量类redis存储pika的和分布式存储Bada的开发工作,这是我的github和博客地址,平时欢迎指正交流^^ ...
- Linux 学习路径
Linux learning path Mind Map graph LR A[Linux学习路径]-->b[计算机概论与硬件相关知识] A -->c[Linux 初级] A --> ...