--创建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. 【小盘子看源码-MyBatis-1】MyBatis配置文件的加载流程

    众所周知,Mybatis有一个全局的配置,在程序启动时会加载XML配置文件,将配置信息映射到org.apache.ibatis.session.Configuration类中,例如如下配置文件. &l ...

  2. oracle使用Union时遇到列格式clob和varchar2不符,不能转的问题

    其实这个很简单,思路就是把clob转为varchar,在查询的时候使用dbms_lob.substr(coulmn,4000):就可以把指定列从clob转化为varchar2.

  3. gradle/gradle plugin/Android studio关系

    gradle - 构建工具,存储于Users/stono/.gradle/wrapper/dists Adroid Studio- IDE Gradle plugin - 在AS中使用Gradle的插 ...

  4. Sketch2Code - Transform sketches into HTML using AI

    Sketch2Code - Transform sketches into HTML using AI https://sketch2code.azurewebsites.net/generated- ...

  5. nginx https 转发

    add_header Content-Security-Policy upgrade-insecure-requests;

  6. Intelij idea 中文字体渲染异常解决方法

    当 Font 选择的字体无法渲染时,则尝试使用该选项所选择的字体渲染.

  7. Django ORM 以连接池方式连接底层连接数据库方法

    django原生支持是不支持 以连接池方式连接数据库的 概述 在使用 Django 进行 Web 开发时, 我们避免不了与数据库打交道. 当并发量低的时候, 不会有任何问题. 但一旦并发量达到一定数量 ...

  8. WordtoPdfUtil word转pdf

    jar: <dependency> <groupId>com.jacob</groupId> <artifactId>jacob</artifac ...

  9. PMP模拟错题总结

    本打算15天完成第二轮复习的,结果项目太忙,拖成了25天.第二轮主要以小绿书为主,就是如下这本 怎么说呢,题目偏向于考ITTO的内容,情景题比较少.可以使用“管理圈”APP作为补充 1.敏感性分析的结 ...

  10. Hive、Inceptor数据倾斜详解及解决

    一.倾斜造成的原因 正常的数据分布理论上都是倾斜的,就是我们所说的20-80原理:80%的财富集中在20%的人手中, 80%的用户只使用20%的功能 , 20%的用户贡献了80%的访问量. 俗话是,一 ...