如何启动一个Vue2.x项目
1. cd到工作目录
2. npm init -y
3. 先查看有没有安装全局的vue-cli,:vue-V,没有的话安装一下:npm install vue-cli
4. 创建项目: vue init webpack Luffy (项目名)
如果出问题: Mac安装Vue-cli时 提示bash: vue: command not found问题
http://www.cnblogs.com/wz2018/p/9849000.html
? Project name luffy
? Project description A Vue.js project
? Author
? Vue build standalone
? Install vue-router? Yes
? Use ESLint to lint your code? No
? Set up unit tests No
? Setup e2e tests with Nightwatch? No
? Should we run `npm install` for you after the project has been created?(recommended) (Use arrow keys)
❯ Yes, use NPM
5. 项目启动 npm run dev
目录结构:
build: 出口文件,webpack配置文件
src: 工作目录 main 主入口文件
index.js: 注册组件
component 创建组件,
app.vue 中注册
重启项目 需要cd 进入自己建立的项目下 然后 npm run dev
使用element-ui
1. 在 main.js 中写入以下内容:
import ElementUI from 'element-ui';
import 'element-ui/lib/theme-chalk/index.css';
加载: Vue.use(ElementUI);
2. MyHeader中添加组件
复制到组件中, 根据条件添加 data数据
添加路由:
1. component中建立组件,
2. 在index.js中注册组件 先导入组件, 有多少个注册多少个组件, path:'/', name:'xxx', component:组件名
3. template中 标签添加 :router="true"
4. app.vue中 添加 <router-view></router-view>
打包
npm run build
VUEX 组件通信
1. cd 到项目目录,安装 npm i vuex
2. 不解耦: 导入/use/实例化/注册
解耦: 新建store.js,导入vue,vuex/use/export, main.js导入,注册
如何启动一个Vue2.x项目的更多相关文章
- 如何启动一个Vue3.x项目
1. 安装node.js 2. cd到项目目录下 3. npm run serve Node.js下载与安装(npm) Node.js 是一个基于 Chrome V8 引擎的 JavaScript 运 ...
- 在服务器中无法自宿主启动一个webapi项目,引出查看系统端口是否被占用
在windows server下启动一个webapi的.net core项目报错 如下图: 让我以为服务器还需要别的配置.后来发现原来是线程被占用了. 在windows下查看某线程是否被占用的命令如下 ...
- IdentityServer4[2]:启动一个新的IdentityServer项目
启动一个新的IdentityServer项目 从头开始,从基础开始,然后变得更加复杂,循序渐进的学习 工具:VS2017 15.9.8 .Net Core2.2 基本过程 创建一个新的ASP.NET ...
- 使用Vue2+webpack+Es6快速开发一个移动端项目,封装属于自己的jsonpAPI和手势响应式组件
导语 最近看到不少使用vue制作的音乐播放器,挺好玩的,本来工作中也经常使用Vue,一起交流学习,好的话点个star哦 本项目特点如下 : 1. 原生js封装自己的跨域请求函数,支持promise调用 ...
- Vue2构建项目实战
转载整理自http://blog.csdn.net/fungleo/article/details/77575077 vue构建单页应用原理 SPA 不是指水疗.是 single page web a ...
- 从零开始搭建Vue2.0项目(一)之快速开始
从零开始搭建Vue2.0项目(一)之项目快速开始 前言 该样板适用于大型,严肃的项目,并假定您对Webpack和有所了解vue-loader.确保还阅读vue-loader的文档,了解常见的工作流程配 ...
- 【.net 深呼吸】启动一个进程并实时获取状态信息
地球人和火星人都知道,Process类既可以获取正在运行的进程,也可以启动一个新的进程.在79.77%应用场合,我们只需要让目标进程顺利启动就完事了,至于它执行了啥,有没有出错,啥时候退出就不管了. ...
- 如何启动一个Java Web应用
最近使用一个开源项目写程序,为了方便沟通加入了相关的讨论群,经常在群里看到有人问项目怎么启动不起来,在此提供一下解决思路1.查看自己下载的项目目录通过文件夹结构,你能够看出来你下载的是一个maven项 ...
- android技巧(一):如何方便知晓当前Activity?如何管理应用中的Activity?如何最佳的启动一个Activity?
1.如何方便知晓当前Activity? 可以不看代码根据当前界面就知道界面所在Activity的写法: 建立BaseActivity,继承自Activity,在BaseActivity的OnCreat ...
随机推荐
- atomic write pipe
阅读 skynet 代码 socket_server 部分,发现对 socket 的写操作流程是这样的: 1. 各个服务(各线程)将数据写到 sendctrl_fd,这是一个 pipe 的 写端 2. ...
- Apache VirtualHost的配置
自从电脑更换为mac后, 一直没有时间去配置php的环境.导致每次要更改php代码的时候, 都是本地更改,然后直接推送到服务器上运行 这样的开发和测试及其耗时且繁琐, 所以早上特地决定弄好mac下的p ...
- 利用koa打造restful API
概述 最近学习利用koa搭建API接口,小有所得,现在记录下来,供以后开发时参考,相信对其他人也有用. 就目前我所知道的而言,API有2种,一种是jsonp这种API,前端通过ajax来进行跨域请求获 ...
- django基础之二
一.什么是架构? 框架,即framework,特指为解决一个开放性问题而设计的具有一定约束性的支撑结构,使用框架可以帮你快速开发特定的系统,简单地说,就是你用别人搭建好的舞台来做表演. 对于所有的We ...
- [Umbraco] Data Types介绍
Data Types是在建立document type时需要用到的,系统自带了很多用于开发的类型,如常用的下拉列表dropdown, textbox, radiobox, checkbox以及上传,h ...
- Python:SQLMap的工作流程
流程图 代码解析 后面补充…… 版权 作 者:曾是土木人 新浪微博:http://weibo.com/cstmr 转载请注明出处:http://www.cnblogs.com/hongfei/p/ ...
- linux使用find和crontab命令定期清理过期文件
crontab 命令 crontab 命令是 Linux 中用来设定重复执行命令或脚本的工具.它能够在指定的时间段内,按照需求以某一时间间隔执行命令或脚本. crontab 的基本用法 crontab ...
- vue父组件传参给子组件
其实组件之间传参有很多种方法: 1.通过本地存储 2.使用vuex状态管理 今天记录一下第三种方法 1.首页我们先创建一个项目(创建项目自行百度) 2.打开项目,在components文件夹下新建一个 ...
- salesforce 零基础学习(七十)使用jquery tree实现树形结构模式
项目中UI需要用到树形结构显示内容,后来尽管不需要做了,不过还是自己做着玩玩,mark一下,免得以后项目中用到. 实现树形结构在此使用的是jquery的dynatree.js.关于dynatree的使 ...
- mybatis JdbcTypeInterceptor - 运行时自动添加 jdbcType 属性
上代码: package tk.mybatis.plugin; import org.apache.ibatis.executor.ErrorContext; import org.apache.ib ...