Vue组件化入门详解

init文件

首先创建文件,在终端进入该文件目录下,输入

vue init webpack vuetest

这一步实例化一个Vue构造函数,会执行Vue的init方法,在init方法中只要执行三部分,一是初始化环境变量,而是处理Vue组件数据,三是解析挂载组件。

根据自己要求安装

image.png

最后会出现一=一个地址,这个地址不是上线地址,而是Vue调试地址,上线的话还有执行打包

image1.png

执行上述文件时会自动生成下列文件夹,src文件里面放置未打包之前的文件,src中assets文件夹存放需要打包的文件,component文件存放各种组件

image2.png

如果最后文件写好需要打包,执行命令

npm run build

执行之后会自动生成一个dis文件,如果文件不需要打包,可以把文件放置在static文件里面,例如JQ文件,但不打包的文件就需要引用,static里面有个.gitkeep文件,这个文件是防止文件打包上传到github时避免被过滤掉,因为如果是空文件,是传不到github中的。

image4.png

如下图所示,我们需要的JQ文件不需要打包的话就需要在index.html文件头部引入,index.html是Vue的进入口

image5.png
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • Spring Cloud为开发人员提供了快速构建分布式系统中一些常见模式的工具(例如配置管理,服务发现,断路器,智...
    卡卡罗2017阅读 135,478评论 19 139
  • 本文基于工作项目开发,做的整理笔记因工作需要,项目框架由最初的Java/jsp模式,逐渐转移成node/expre...
    SeasonDe阅读 12,124评论 3 35
  • 理想的生活是,不被上一秒牵挂,不为下一秒担忧。——王菲 我只想说,天后的理想也是我的理想,哈哈,赞同的先点个赞。 ...
    小m_阅读 3,188评论 1 1
  • 【0512今日话题】 你经历过的最难忘的生日是哪一次?(不管是别人的还是自己的。) —————— 从小到大没有过过...
    孙国飞扬阅读 1,092评论 2 3
  • ☻今日心晴☻ 只因为你 张栋梁 ☻洞子张老匠火锅 ☻ 坐标:香蜜湖。 四川火锅就是爽!爽!爽! 不要怀疑,真的超级...
    sunny段晓阅读 1,332评论 0 0