Vue-webpack-hbuilderx 开发前端基本命令
--创建Vue 项目 pc 需要装 node 环境 ,安装完之后,就可以在cmd中使用npm 命令了
1:npm install -g vue-cli //电脑端需要安装vue 脚手架模板,电脑端一次安装就行
2:vue init webpack vue-demo-1 //创建一个Vue项目 创建完成之后,根据黄色命令继续执行命令
3: 打包Vue项目,在HBUILDERX 中使用命令
1:npm run build
2: 发布1:使用今天服务器工具包
npm install -g serve
serve dist
二:Vue的组件间通信
1: 组件传递数据:
//:定义组件数据
export default {
data() {
return {
commonet: [
{
name: “ABC”,
sex: “女”
},
{
name: “Abd”,
sex: “男”
}
]
}
}
}
//: 在组件标签上使用定义的组件数据
<custombiaoqian :comonet=“commonet”/>
2: 组件使用组件传递过来的数据:
//第一种方式
export default{
props ['comment']
}
// 第二种方式
export default{
props:{
comment: Object
}
}
//使用数据
{{commoent.name}}
出现正常提示: 访问:http://localhost:5000
Vue-webpack-hbuilderx 开发前端基本命令的更多相关文章
- windows环境下搭建vue+webpack的开发环境
前段时间一直在断断续续的看vue的官方文档,后来就慢慢的学习搭建vue的开发环境,已经有将近两周了,每到最后一步的时候就会报错,搞的我好郁闷,搁置了好几天,今天又接着搞vue的开发环境,终于成功了.我 ...
- windows下搭建vue+webpack的开发环境
1. 安装git其右键git bash here定位比cmd的命令行要准确,接下来的命令都是利用git bash here.2. 安装node.js一般利用vue创建项目是要搭配webpack项目构建 ...
- VUE+WebPack实现精美前端游戏:CardBattle的游戏场景设置
C:\Users\ZHONGZHENHUA\cardBattle\src\App.vue src/App.vue <template> <div id="app" ...
- windows环境下安装vue+webpack的开发环境
本人最近在学习vue,在学习的过程中遇到对的问题和解决方法 1.我们首先要安装node.js.node.js的官方地址为:https://nodejs.org/en/download/,下载完毕,按照 ...
- VUE+WebPack游戏开发:神庙逃亡的游戏设计
- 前端 vue-cli+Webpack 项目开发环境配置、创建一个vue-demo
一.软件及命令: (1)下载node.js 最新的LTS 版本,下载 msi格式的(直接点击安装即可). (2)命令1:npm install cnpm -g 命令2:cnpm install web ...
- vue+webpack开发(一)
一开始接触这个vue+webpack的时候,实在是摸不着头脑,根本无从下手. 但是经过这两天的研究,其实你会发现vue其实并不难,难度都在webpack你对webpack的理解. webpack顾名思 ...
- Vue.js-组件化前端开发新思路
Vue.js-组件化前端开发新思路 12017.04.14 18:31:25字数 6228阅读 5632 本文章是我最近在公司的一场内部分享的内容.我有个习惯就是每次分享都会先将要分享的内容写成文章. ...
- Vue+Webpack构建移动端京东金融(一、开发前准备)
一.开发前准备 1.node环境搭建 去node.js官网下载长期支持版本的node,采用全局安装,安装方式自行百度 网址:https://nodejs.org/zh-cn/ 安装后在cmd命令行运行 ...
随机推荐
- phpstudy 首次安装后打开网站 数据库内容 中文乱码
首次安装完成 phpstudy 后,默认的 my.ini 配置只有数据库文件位置,其他的都没有设置,这时如果想要输出数据库中的中文后,显示到页面上就会变成中文乱码 解决方法: 打开 phpstudy ...
- android 8.1 wifi提示"已连接 但无法访问互联网"的解决办法
主要是GFW的问题 adb shell以下命令解决 settings put settings put settings put settings put global captive_portal_ ...
- BigDecimal 与double 转化失真
1.BigDecimal(double val): 失真, 不要使用 BigDecimal(0.1)的值是: 0.1000000000000000055511151231257827021181583 ...
- EasyNVR网页摄像机无插件H5、谷歌Chrome直播方案-Onvif(三)使用Onvif协议进行设备PTZ云台控制
背景分析 熟悉EasyNVR产品的盆友们应该都知道,EasyNVR主要完成的是RTSP视频流到RTMP/HLS/Flv的转码,并提供了一套api和一个可视化管理平台来便于调用.同时支持ONVIF协议进 ...
- 你该怎么学习C++——思想层面
Javascript是世界上最受误解的语言,其实C++何尝不是.坊间流传的错误的C++学习方法一抓就是一大把.我自己在学习C++的过程中也走了许多弯路,浪费了不少时间. 为什么会存在这么多错误认识?原 ...
- Android 问题解决 HorizontalScrollView显示不全(转)
原链接:https://www.jianshu.com/p/003adbcaff9d Android 问题解决 HorizontalScrollView显示不全 <HorizontalScrol ...
- pidstat 命令详解
pidstat 概述 pidstat是sysstat工具的一个命令,用于监控全部或指定进程的cpu.内存.线程.设备IO等系统资源的占用情况.pidstat首次运行时显示自系统启动开始的各项统计信息, ...
- Oracle 实现表中id字段自增长
Oracle 实现表中id字段自增长 最近正在学习Oracle的时候发现Oracle表中的字段不能像mysql中那样可以用auto increment修饰字段从而让id这种主键字段实现自增长. 那Or ...
- [数据结构 - 第3章] 线性表之顺序表(C++实现)
一.类定义 顺序表类的定义如下: #ifndef SEQLIST_H #define SEQLIST_H typedef int ElemType; /* "ElemType类型根据实际情况 ...
- jquery预加载显示百分比
jquery预加载显示百分比 <pre> <img class="bj loadimg" loadimg="/weiqingshu/images/1/b ...