Vue 创建项目

本文介绍了如何在WebStorm中创建Vue项目,包括通过`vue init webpack my-vue`初始化项目,`npm install`安装依赖,`npm run dev`运行项目。接着详细解释了项目中各个文件夹的功能,如`build`、`config`、`node_modules`、`src`中的`assets`、`components`、`App.vue`、`main.js`、`static`以及`index.html`。此外,还讨论了Vue组件的使用、模板渲染及`$emit()`事件触发等核心概念。
摘要由CSDN通过智能技术生成
在webstrom里面创建vue项目
npm install vue
1:vue init webpack my-vue //创建一个 my-vue的项目 不能有大写字母
cd my-vue
2:npm install //安装依赖
3,npm run dev //运行项目

创建完成之后 每个文件夹的功效:
1:build 最终 发布代码的存放位置
2:config 配置目录包括端口号
3:node_modules npm加载的项目依赖模块
4:src-》assets:放置一些图片,如logo
components 放置组件的文件夹
App.vue 项目入口文件
main.js 项目的核心文件
5,:static 静态资源目录。如图片 字体等
6:index.html 首页入口文件 运行这个项目直接打开 该html

视图需要引入租件引入nvHead,nvTop的组件 template组件的使用 跟import components引入的顺序必须保持一致(傅祖建引入自租件在html里面的使用的先后顺序必须跟important的引入顺序保持一致)
html:


js


this.$emit()触发当前实例上的事件

main.js 里面 render函数:

render: h => h(App);等价于:

{
render: h => {
return h(App)
}
}

等价于:

{
render: function (h) {
return h(App)
}
}

意思是:render函数是一个渲染视图,提供给el挂载的 如果不加就等于没有视图给el挂载。

跟下面template渲染App是一样的效果



评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值