--创建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. java ali支付服务端对接

    引入SDK: <!-- https://mvnrepository.com/artifact/com.aliyun/aliyun-java-sdk-core --><dependen ...

  2. 《Go语言实战》读书笔记

    <Go语言实战>中文版pdf 百度网盘: https://pan.baidu.com/s/1kr-gMzaPAn8BFZG0P24Oiw 提取码: r6rt 书籍源码:https://gi ...

  3. bilibili投屏到电脑

    bilibili投屏到TV B栈上有丰富的视频资源,电视盒子小米,自带匹配的投屏功能. 但是如何将哔哩哔哩投屏到电脑上? bilibili投屏到PC上 万能的知乎给出了答案. https://www. ...

  4. js 动态加载 jq

    var script=document.createElement("script"); script.type="text/javascript"; scri ...

  5. [原]使用kubeadm部署kubernetes(一)

    #######################    以下为声明  ##################### 在公众号  木子李的菜田 输入关键词:   k8s 有系列安装文档 此文档是之前做笔记在 ...

  6. vue双循环或者多循环作用于同一元素时,在外套template标签

    如图,两个v-for,都是要循环创建tr标签.同理,v-if也是套template

  7. 1-2docker-基本的使用

    1.Docker 官⽅提供了⼀个公共的镜像仓库 https://hub.docker.com 2.获取镜像 docker pull [选项] [Docker Registry 地址[:端⼝]/]仓库名 ...

  8. Intellij IDEA 启动出现“前言中不允许有内容”

    修改错误方法,在IDEA的workspace中找到 .idea 目录下的workspace.xml文件删除即可.

  9. PHP设计模式 - 中介者模式

    中介者模式用于开发一个对象,这个对象能够在类似对象相互之间不直接相互的情况下传送或者调解对这些对象的集合的修改. 一般处理具有类似属性,需要保持同步的非耦合对象时,最佳的做法就是中介者模式.PHP中不 ...

  10. Windows下编译Redis5.0.5

    先去弄Cygwin环境 http://www.cygwin.com/ 下载完成 打开 下一步 下一步 下一步 下一步 下一步,出现一个界面,让你添加地址,你打开官网,选择mirror sites,点击 ...