一.关于vuejs 这是一个MVVM的前端开发框架,model(数据).viewmode(通讯).view(视图),它吸取了reactjs和angularjs的长处,核心重点在于组件化的设计原则. 我们都知道一个普通常见的页面,他会由header,body,footer,组成,里面再细分还有nav,list,slidebar等等,组件化就是将这些会重复用到的代码封装起来,在一个页面中需要用到的时候进行引入. 二.搭建脚手架(初始化项目) 做一个项目开始将一些文件环境搭建好,这里vue提供了vue…
http://router.vuejs.org/zh-cn/essentials/nested-routes.html 使用嵌套路由开发,这里会出错主要把Vue.use(VueRouter);要进行引用 main.js import Vue from 'vue'; import VueRouter from 'vue-router'; Vue.use(VueRouter); import App from './App'; import goods from './components/good…
对于多张页面需要里存在相同模块,可以进行组建化的开发模式. 例如:此处需要一个评分标准组件,创建一个components/star/star.vue. 在需要引入该组建的页面上 import进去<script>import star from 'components/star/star'</script>…
做了几个月vue项目,最近两个项目使用脚手架搭建的,确实用脚手架搭建方便了许多,想想以前自己手配的时候,确实是... 1.在这之前我是默认你已经使用过vue的,也默认你已经安装了node.js 2.接着安装全局的vue-cli脚手架,用于帮助搭建所需的模板框架 3.命令为:cnpm install -g vue-cli,回车,等待安装 安装完后,可以输入vue,然后回车,如果出现vue的信息,则说明安装成功了. 4.紧接着,就该创建项目了,自己找一个合适的地方,新建一个项目文件夹,根据自己的需要…
[TOC] 1. 前言 vue-cli 一个简单的构建Vue.js项目的命令行界面 整体过程: $ npm install -g vue-cli $ vue init webpack vue-admin $ cd vue-admin $ npm install $ npm run dev 后面分步说明. 2. 安装 前提条件,Node.js >=4.x版本,建议使用6.x版本.npm版本 > 3.x 全局安装vue-cli $ npm install -g vue-cli ... 3. 使用…
配置文件在项目根目录里,文件名以 .eslintrc.* 为名. 为了兼容以前写的代码,避免修改太多代码,把不符合自己习惯的规则去掉,简单配置代码: module.exports = { root: true, parser: 'vue-eslint-parser', parserOptions: { "ecmaVersion": 6, "sourceType": "module" }, env: { "browser": t…
使用vue-cli可以规范项目,提高开发效率,但是使用vue-cli时需要一些ECMAScript6的知识,特别是ES6中的模块管理内容,本章先介绍ES6中的基础与模块化的内容再使用vue-cli开发vue项目. 一.ECMAScript6概要 ECMAScript是一种由Ecma国际(前身为欧洲计算机制造商协会,英文名称是European Computer Manufacturers Association)通过ECMA-262标准化的脚本程序设计语言.这种语言在万维网上应用广泛,它往往被称为…
一.使用 vue-cli(脚手架)搭建项目 1) Vue-cli 是 vue 官方提供的用于搭建基于 vue+webpack+es6 项目的脚手架工具 2) 在线文档:https://github.com/vuejs/vue-cli 3) 操作: (mypro 是自定义名称) npm install -g vue-cli vue init webpack mypro cd mypro npm install npm run dev 访问: localhost: 二.项目结构分析 mypro |-…
1.安装vue-cli 3.0 ? 1 2 3 npm install -g @vue/cli # or yarn global add @vue/cli 安装成功后查看版本:vue -V(大写的V) 2.命令变化 ? 1 vue create --help 用法:create [options] <app-name> 创建一个由 `vue-cli-service` 提供支持的新项目 选项: -p, --preset <presetName>       忽略提示符并使用已保存的或…
本次是使用@vue/cli 3.11.0版本搭建的vue项目 1. 首先确保自己的电脑上的Node.js的版本是8.9版本或者以上 2. 全局安装vue/cli npm install @vue/cli -g 或者yarn add @vue/cli -g 3. 使用脚手架搭建项目 vue create my-vue(my-vue就是创建的项目名) 4. 然后使用↑↓选择Manually select features(手动选择) 5. 下面这么多的扩展项只需要选择Babel   Router …
新开个项目,小项目,小.顺手就用vue吧,vue3出来也几个月了,直接上了吧.一年多没用vue了,用的时候也得再熟悉,不如直接干3了! vue官方推荐使用的脚手架是 Vite 和 vue-cli ,延续vue2时使用的vue-cli进行搭建,顺手顺眼.集成webpack,热更新,不用操心其他配置操作,专心项目开发. 安装vue-cli就不说了. 描述了vue的很多功能,比如 ...... 创建项目,可以使用 vue create app 或者 vue ui 来启动GUI页面. 都行..都行...…
图中&属于postcss的语法,这样书写样式可以清楚的看出选择器之前的层级关系,非常好用. 在利用vue-cli脚手架搭建的项目中如果不配置是不支持这种写法的,这样写不会报错,但是样式不生效. 为了让项目中的vue文件支持这种写法,需要在配置postcss-cssnext模块. 往项目中安装postcss-cssnext模块: npm install postcss-cssnext --save-dev 安装完后,会在项目的package.json文件的devDependencies对象中看到p…
一,vue-cli环境搭建 1,全局安装webpack npm install webpack -g 2,安装vue脚手架 npm install vue-cli -g 3,新建一个新的project,终端定位到该项目下 4,初始化项目 vue init webpack-simple 会让你进行该项目的一些基本设置,如下图 5,安装项目依赖 npm install 6,启动项目 npm run dev 可以看到终端提示成功 在浏览器上打开localhost:8080/#/可以看到如下图所示,说明…
搭建系统: Windows系统 简单了解Node.js.npm,安装Node.js,下载网址:http://nodejs.cn/download/ 查看node,npm安装成功与否.打开cmd命令行,输入命令 node-v  .npm -v 了解cnpm,输入命令 npm install -g cnpm --registry=https://registry.npm.taobao.org 查看安装成功与否 输入命令 cnpm -v 了解webpack,借助npm工具安装webpack.输入命令…
前言: 在使用Vue-cli脚手架搭建项目之前,需要安装node.js和npm以及vue-cli. 开始搭建项目: 1.打开cmd win+R 2.转到要搭建的项目路径: g: cd Webapp/vue 3.开始创建项目: vue init webpack youprogectName 4.执行下面两条命令 cd vue_05 npm run dev 5.查看项目是否生成:…
前言 在学习完vue基础语法之后,学着利用vue-cli脚手架搭建一个项目,本篇随笔主要记录搭建的过程,供大家一起学习. 具体内容 搭建vue项目的准备工作 1.安装Nodejs.NPM以及VSCode Nodejs:是一个基于Chrome V8引擎的JavaScript运行环境,它结合NPM一起来管理包. NPM:是和Nodejs一起安装的包管理工具,可以解决NodeJS代码部署上的诸多问题:常见的使用场景有以下几种: (1)允许用户从NPM服务器下载别人编写的第三方包到本地使用: (2)允许…
一.概述 本文将介绍vue项目完整的搭建流程,在使用新版本的脚手架基础上,进行了一系列的完善和配置.主要内容如下: 1.项目初始化 安装脚手架 创建项目 项目结构 2.项目搭建配置 引入第三方插件 路由管理模块vue-router的配置 状态管理模块vuex的配置 请求模块axios的配置 环境变量的配置 配置文件config的配置 二.项目搭建 1.项目初始化 (1)安装脚手架 全局安装过旧版本的 vue-cli(1.x 或 2.x)要先卸载它,否则跳过此步:npm uninstall vue…
一.使用脚手架搭建项目框架 1.首先使用脚手架搭建React项目(React+TypeScript+Umi.js) 在控制台输入命令:yarn create @umijs/umi-app 2.引入Antd组件 在控制台输入命令:yarn add antd 3.安装依赖 在控制台输入命令:yarn 4.启动项目 yarn start 二.项目目录与配置文件介绍 1.项目目录结构截图: 2.主要核心代码目录:/page 3.umi配置文件:.umirc.ts (官方文档:https://umijs.…
我的小项目主要是会用到MongoDB. 呵呵,我也是现学现卖. 都说小公司十八般武艺样样稀疏,没有办法啊! 兵来兵挡,将来将挡!自己是个兵呢?还是一个将呢! 没有公司培养,就自己培养自己呗.差的远一点罢了. 首先去官网下载一个MongoDB. 呵呵,首先安装二进制包,. 安装好了之后,找到bin目录,把路径复制下来.配置环境变量. 写入环境变量是为了直接使用mongod/mongo等命令 控制台输入mongo,我们就可以知道自己安装的mogodb是哪一个版本了. 其次需要使用mongod启动mo…
搭建vue项目之前你需要安装vue的脚手架和node.js,一起去看看怎么搭建一个vue环境吧.(学编程语言最爱看见的就是用这个先写一个helloworld,只想说我对世界友好可是现实是残酷的......) 1& 安装node.js (安装网址点击下面链接) node.js下载网址 安装完以后桌面上什么都没有是不是有点慌啊!不急,你先打开Dos窗口,输入以下命令, 如果界面如下:(恭喜你) 也有可能失败,失败的原因可能是系统权限,目前还没有找到最好的解决办法..... Node.js是个啥人家首…
在前两篇博文中已经做了铺垫,下面咱们就可以用前面介绍过的内容开始做一个小项目了(项目中会用到Afinal框架,不会用Afinal的童鞋可以先看一下上一篇博文),正所谓麻雀虽小,五脏俱全,这在里我会尽量的将前期的项目搭建做的相对实用一些,以便后期可以有效的实现团队协作和项目维护.一开始可能会看起来麻烦些,可能会觉得还不如直接用简单的方式去实现来的方便,磨刀不误砍柴工嘛,要想后期开发效率高一些,前期就不要图省事了. 一个项目肯定不是一蹴而就的,咱们一步一步来,本篇博文先详细介绍项目搭建.通过url地…
Sudoku 小项目 - 软工第二次作业 Part 1 · 项目相关 Github 地址: https://github.com/TheSkyFucker/Sudoku 项目的更多信息以及所有开发文档见 README.md 整体过程,Todolist工具: Teambition 部分动态 撰写该文时 SourceTree 结构如下: Part 2 · PSP 表格 Statu Stages 预估耗时 实际耗时 Accept [计划]Planning 60 100 Accept -- 估计时间 E…
一. node安装 1)如果不确定自己是否安装了node,可以在命令行工具内执行: node -v  (检查一下 版本): 2)如果 执行结果显示: xx 不是内部命令,说明你还没有安装node , node 安装地址:http://nodejs.cn/download/ 注 :安装 vue-cli 脚手架目前需要node版本为 v4.0 以上: 第一步: 用脚手架搭建项目 :  1). npm install --global vue-cli 2). vue init webpack my-p…
SSM 框架-03-MyEclipse+Tomcat+MAVEN+SVN项目完整环境搭建 如果你是使用 Eclipse 你需要先安装 MyEclipse,请参考:SSM 框架-02-MyEclipse 2017 安装与破解 1.JDK的安装     在看这篇文章的人应该都不需要了,但也不要直接跳过请在 cmd 检查 java,javac,java -version,这 3 条命令有一条出错都是有问题的.     配置步骤:首先下载JDK,这个从 sun 公司官网 可以下载,根据自己的系统选择64…
https://www.jianshu.com/p/fbcad30031c2 vue3.0官网:https://cli.vuejs.org/zh/guide/ 介绍: notice: 这份文档是对应 @vue/cli 3.x 版本的.老版本的 vue-cli 文档请移步这里 Vue CLI 是一个基于 Vue.js 进行快速开发的完整系统,提供: 1.通过 @vue/cli 搭建交互式的项目脚手架. 2.通过 @vue/cli + @vue/cli-service-global 快速开始零配置原…
编程路上的菜鸟一枚 : 最近接触了vue 然后写了一个练手的项目 使用vue-cli脚手架来搭建了的项目 技术: vue2  + vue-router  + ES6 + axios 框架有 mint-ui(不建议使用,早已经不更新了,推荐vant),mui 项目演示: 新闻 热播电影列表 商品(用豆瓣电影模拟的) 购买 github地址:https://github.com/j190512/vue_practice/tree/master/vue/vue-cli/pj_practice 一个简单…
1 概述 1.1 文章目的 本文主要想为研发PHP项目的企业或个人提供上云指导,通过本文中的示例项目 “workerman-todpole”,为开发者提供包括项目管理,代码托管,代码检查,编译构建,测试管理的操作指导,覆盖软件开发全生命周期. 1.2 项目详情 1. 项目名称:workerman-todpole社区系统 2. 项目简介:workerman-todpole采用PHP(workerman框架)+HTML5技术开发,是一款以workerman作为应用服务器,前端采用HTML5+WebS…
学习机器学习相关技术的最好方式就是先自己设计和完成一些小项目. Python 是一种非常流行和强大的解释性编程语言.不像 R 语言,Python 是个很完整的语言和平台,你既可以用来做研发,也可以用来开发产品体系. 而且,Python 还有很多模块和程序库供我们选择,从而针对一个任务能有很多个解决方案.怎么样,听起来还是很厉害的吧? 如果用 Python 执行机器学习,刚开始时最好方式就是先完成一个小项目,为什么这么说呢? 因为这会让你先懂得如何安装和启动 Python 解释器(这是最起码的要求…
个人脚手架搭建 -- charmingsong-cli 目的 为了解决多次构建相同功能的项目,在一定程度上需要定制化以及私有化设置 设计 问题 为什么不用现成的脚手架生成? 如果利用vue或者react的脚手架搭建项目可能创建完项目后还需要一系列的配置以及更改展示样式,并没有真正的解决问题.并且各自的脚手架只能生成各自的框架结构,其他项目不支持.例如,用vue-cli生成一个react项目,是不可以的. 为什么不直接复制相同的项目? 现有的项目中逻辑代码关联性很强,并且项目中可能存在一些基于项目…
在介绍小项目之前,在此说明一下此代码并非本人所写,我只是随笔的整理者. 在介绍之前先展现一下效果图. 看过效果图大家应该很熟悉了,就是饿了么的一个界面而已,值得注意的是,实现时并没有采用本地连接,而是实打实的网络连接.看一下文件架构. 这一采用的是MVC设计模式,虽然文件很少,但是也可以看. 下面开始正式介绍小项目的实现. 首先介绍Model的实现,很简单,实现模型即可, Shop.h // // Shop.h // CX-小项目(饿了么 网络部分 简单实现) // // Created by…