--创建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 开发前端基本命令的更多相关文章

  1. windows环境下搭建vue+webpack的开发环境

    前段时间一直在断断续续的看vue的官方文档,后来就慢慢的学习搭建vue的开发环境,已经有将近两周了,每到最后一步的时候就会报错,搞的我好郁闷,搁置了好几天,今天又接着搞vue的开发环境,终于成功了.我 ...

  2. windows下搭建vue+webpack的开发环境

    1. 安装git其右键git bash here定位比cmd的命令行要准确,接下来的命令都是利用git bash here.2. 安装node.js一般利用vue创建项目是要搭配webpack项目构建 ...

  3. VUE+WebPack实现精美前端游戏:CardBattle的游戏场景设置

    C:\Users\ZHONGZHENHUA\cardBattle\src\App.vue src/App.vue <template> <div id="app" ...

  4. windows环境下安装vue+webpack的开发环境

    本人最近在学习vue,在学习的过程中遇到对的问题和解决方法 1.我们首先要安装node.js.node.js的官方地址为:https://nodejs.org/en/download/,下载完毕,按照 ...

  5. VUE+WebPack游戏开发:神庙逃亡的游戏设计

  6. 前端 vue-cli+Webpack 项目开发环境配置、创建一个vue-demo

    一.软件及命令: (1)下载node.js 最新的LTS 版本,下载 msi格式的(直接点击安装即可). (2)命令1:npm install cnpm -g 命令2:cnpm install web ...

  7. vue+webpack开发(一)

    一开始接触这个vue+webpack的时候,实在是摸不着头脑,根本无从下手. 但是经过这两天的研究,其实你会发现vue其实并不难,难度都在webpack你对webpack的理解. webpack顾名思 ...

  8. Vue.js-组件化前端开发新思路

    Vue.js-组件化前端开发新思路 12017.04.14 18:31:25字数 6228阅读 5632 本文章是我最近在公司的一场内部分享的内容.我有个习惯就是每次分享都会先将要分享的内容写成文章. ...

  9. Vue+Webpack构建移动端京东金融(一、开发前准备)

    一.开发前准备 1.node环境搭建 去node.js官网下载长期支持版本的node,采用全局安装,安装方式自行百度 网址:https://nodejs.org/zh-cn/ 安装后在cmd命令行运行 ...

随机推荐

  1. phpstudy 首次安装后打开网站 数据库内容 中文乱码

    首次安装完成 phpstudy 后,默认的 my.ini 配置只有数据库文件位置,其他的都没有设置,这时如果想要输出数据库中的中文后,显示到页面上就会变成中文乱码 解决方法: 打开 phpstudy ...

  2. android 8.1 wifi提示"已连接 但无法访问互联网"的解决办法

    主要是GFW的问题 adb shell以下命令解决 settings put settings put settings put settings put global captive_portal_ ...

  3. BigDecimal 与double 转化失真

    1.BigDecimal(double val): 失真, 不要使用 BigDecimal(0.1)的值是: 0.1000000000000000055511151231257827021181583 ...

  4. EasyNVR网页摄像机无插件H5、谷歌Chrome直播方案-Onvif(三)使用Onvif协议进行设备PTZ云台控制

    背景分析 熟悉EasyNVR产品的盆友们应该都知道,EasyNVR主要完成的是RTSP视频流到RTMP/HLS/Flv的转码,并提供了一套api和一个可视化管理平台来便于调用.同时支持ONVIF协议进 ...

  5. 你该怎么学习C++——思想层面

    Javascript是世界上最受误解的语言,其实C++何尝不是.坊间流传的错误的C++学习方法一抓就是一大把.我自己在学习C++的过程中也走了许多弯路,浪费了不少时间. 为什么会存在这么多错误认识?原 ...

  6. Android 问题解决 HorizontalScrollView显示不全(转)

    原链接:https://www.jianshu.com/p/003adbcaff9d Android 问题解决 HorizontalScrollView显示不全 <HorizontalScrol ...

  7. pidstat 命令详解

    pidstat 概述 pidstat是sysstat工具的一个命令,用于监控全部或指定进程的cpu.内存.线程.设备IO等系统资源的占用情况.pidstat首次运行时显示自系统启动开始的各项统计信息, ...

  8. Oracle 实现表中id字段自增长

    Oracle 实现表中id字段自增长 最近正在学习Oracle的时候发现Oracle表中的字段不能像mysql中那样可以用auto increment修饰字段从而让id这种主键字段实现自增长. 那Or ...

  9. [数据结构 - 第3章] 线性表之顺序表(C++实现)

    一.类定义 顺序表类的定义如下: #ifndef SEQLIST_H #define SEQLIST_H typedef int ElemType; /* "ElemType类型根据实际情况 ...

  10. jquery预加载显示百分比

    jquery预加载显示百分比 <pre> <img class="bj loadimg" loadimg="/weiqingshu/images/1/b ...