众所皆知,vue对于构建单页面应该相当方便,但是在项目中难免遇到有多个页面的情况. 1.先安装vue-cli脚手架,具体步骤看vue-cli的官方github地址 https://github.com/vuejs/vue-cli;就不详细说明了. 下面是初始化脚手架的选项,按照自己所需求的勾选即可,后面的单元测试,用的上就勾. 生成好的目录结构如下:  2.继续安装依赖 npm install 3.等待若干时间装好以后 ,输入命令npm run dev 运行 打开网页即可看到效果 至此,我们就完…
当我们安装好vue-cli完整的项目以后,我们开始对它进行改造,此处参考了简书某个作者的,附上原文链接 http://www.jianshu.com/p/43697bdee974以及此文例子地址https://github.com/qianyinghuanmie/vue-cli- 1 先安装glob模块 npm install glob --save-dev; 2 安装完毕在bulid文件夹找到utils.js文件修改,修改内容如下: var glob = require('glob'); //…
1. webpack-dev-server下的设置(npm run dev) ./build/webpack.dev.conf.js 中,修改 new HtmlWebpackPlugin ,一个页面一个实例. new HtmlWebpackPlugin({ // 打包后文件名 filename: 'index.html', // html模板 template: './src/views/index.html', // 打包后文件引入位置,['body'|'head'],这里的true等同于bo…
原文: https://github.com/MeCKodo/vue-tutorial 主题 Vue.js (1/2)Vue构建单页应用最佳实战 前言 我们将会选择使用一些vue周边的库 1.使用node.js后台,了解到如何获取数据 2.实现单页路由 3.实现HTTP请求我们的node 4.单项数据流 5.使用.vue文件进行开发 最终我们将会构建出一个小demo,不废话,直接上图. 安装 1.我们将会使用webpack去为我们的模块打包,预处理,热加载.如果你对webpack不熟悉,它就是可…
一.环境搭建: 1.安装node.js 从node.js官网下载并安装node,安装过程很简单,一路"下一步"就可以了.安装完成之后,打开命令行工具(win+r,然后输入cmd),输入 node -v,如下图,如果出现相应的版本号,则说明安装成功 因为在官网下载安装node.js后,就已经自带npm(包管理工具)了,另需要注意的是npm的版本最好是3.x.x以上,以免对后续产生影响. 2.安装淘宝镜像 npm install -g cnpm --registry= https://re…
上节中,我们成功的将vue-cli改造成了多入口,既然用了上简单的脚手架,那就希望用个合适的UI组件,去搜索了几个以后,最后选择了使用vux 贴上其vux的github地址  https://github.com/airyland/vux 里面还有 详细的中文文档. 这是自己完整的github地址 https://github.com/qianyinghuanmie/vue-cli- 简单的过一下安装教程. 1.安装vux npm install vux --save-dev 2.安装vux-l…
spring boot http://docs.spring.io/spring-boot/docs/current-SNAPSHOT/reference/htmlsingle/ vue https://vuejs.org/guide/ vue-router https://github.com/vuejs/vue-router/tree/dev/docs/zh-cn 使用vue+vue-router后不再由模版引擎或jsp生成页面,后台只进行json类型的数据交互. 实际第一次配置容易遇到一些…
如下:package.json // package.json { "name": "ecommerce-mall-front", "version": "0.1.0", "private": true, "scripts": { "serve": "vue-cli-service serve", "build": "…
第一步:首先在控制台输入vue --version,如果出现版本号则进入第三步:否则进入第二步: 第二步:输入npm install cnpm -g --registry=https://registry.npm.taobao.org,安装淘 宝镜像,以后安装其他依赖时候就可以输入cnpm install --- 了,因为npm安装会非 常慢,一般来说会失败: 第三步:控制台输入vue init webpack my-project  注:这里的my-project就是你要创建的 项目的名称,自…
使用ESLint+Prettier来统一前端代码风格 加分号还是不加分号?tab还是空格?你还在为代码风格与同事争论得面红耳赤吗? 正文之前,先看个段子放松一下: 去死吧!你这个异教徒! 想起自己刚入行的时候,从svn上把代码checkout下来,看到同事写的代码,大括号居然换行了.心中暗骂,这个人是不是个**,大括号为什么要换行?年轻气盛的我,居然满腔怒火,将空行一一删掉. 但是关于代码风格,我们很难区分谁对谁错,不同的人有不同偏好,唯有强制要求才能规避争论. 所以,团队关于代码风格必须遵循两…