webstorm+vue初始化项目的方法


Posted in Javascript onOctober 18, 2018

vue新项目准备:

1、安装nodejs,官网下载傻瓜安装

node -v 验证

2、npm包管理器,是集成在node中的,所以安装了node也就有了npm

npm -v 验证

3、安装cnpm

npm install -g cnpm --registry=http://registry.npm.taobao.org

(完成之后,我们就可以用cnpm代替npm来安装依赖包了。如果想进一步了解cnpm的,查看淘宝npm镜像官网。)

4、安装vue-cli脚手架构建工具

npm install -g vue-cli

vue新项目构建:

1、初始化项目模板:

vue init webpack-simple yunshi-approve

或者

vue init webpack yunshi-approve

2、安装npm

cd yunshi-approve

3、安装项目所需要的依赖:

npm install 或 cnpm install

4、运行看效果:

npm run dev

介绍一下目录及其作用:

build:最终发布的代码的存放位置。

config:配置路径、端口号等一些信息,我们刚开始学习的时候选择默认配置。

node_modules:npm 加载的项目依赖模块。

src:这里是我们开发的主要目录,基本上要做的事情都在这个目录里面,里面包含了几个目录及文件:

assets:放置一些图片,如logo等

components:目录里放的是一个组件文件,可以不用。

App.vue:项目入口文件,我们也可以将组件写这里,而不使用components目录。

main.js :项目的核心文件

static:静态资源目录,如图片、字体等。

test:初始测试目录,可删除

.XXXX文件:配置文件。

index.html:首页入口文件,可以添加一些meta信息或者同统计代码啥的。

package.json:项目配置文件。

README.md:项目的说明文件。

以上这篇webstorm+vue初始化项目的方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
基于jquery库的tab新形式使用
Nov 16 Javascript
jquery实现metro效果示例代码
Sep 06 Javascript
一个非常全面的javascript URL解析函数和分段URL解析方法
Apr 12 Javascript
arguments对象验证函数的参数是否合法
Jun 26 Javascript
jsonp跨域请求数据实现手机号码查询实例分析
Dec 12 Javascript
js实现千分符和保留几位小数的简单实例
Aug 01 Javascript
微信小程序左右滑动切换页面详解及实例代码
Feb 28 Javascript
JavaScript中三个等号和两个等号你了解多少
Jul 04 Javascript
Webstorm2016使用技巧(SVN插件使用)
Oct 29 Javascript
vue防止花括号{{}}闪烁v-text和v-html、v-cloak用法示例
Mar 13 Javascript
微信小程序制作扭蛋机代码实例
Sep 24 Javascript
vue-resource 拦截器interceptors使用详解
Jan 18 Vue.js
使用微信小程序开发弹出框应用实例详解
Oct 18 #Javascript
vue: WebStorm设置快速编译运行的方法
Oct 18 #Javascript
vue2.0 路由模式mode="history"的作用
Oct 18 #Javascript
详解vue文件中使用echarts.js的两种方式
Oct 18 #Javascript
使用wxapp-img-loader自定义组件实现微信小程序图片预加载功能
Oct 18 #Javascript
vue中使用cookies和crypto-js实现记住密码和加密的方法
Oct 18 #Javascript
vue中导出Excel表格的实现代码
Oct 18 #Javascript
You might like
火影忍者:这才是千手柱间和扉间的真正死因,角都就比较搞笑了!
2020/03/10 日漫
手把手教你使用DedeCms V3的在线采集图文教程
2007/04/03 PHP
php5.3 废弃函数小结
2010/05/16 PHP
PHP利用百度ai实现文本和图片审核
2019/05/08 PHP
用js判断页面刷新或关闭的方法(onbeforeunload与onunload事件)
2012/06/22 Javascript
JS保存、读取、换行、转Json报错处理方法
2013/06/14 Javascript
一个简单的jquery进度条示例
2014/04/28 Javascript
NodeJS Express框架中处理404页面一个方式
2014/05/28 NodeJs
Egret引擎开发指南之创建项目
2014/09/03 Javascript
javascript通过元素id和name直接取得元素的方法
2015/04/28 Javascript
使用CamanJS在Web页面上处理图像的技巧
2015/08/18 Javascript
JavaScript简单遍历DOM对象所有属性的实现方法
2015/10/21 Javascript
浅谈js函数三种定义方式 & 四种调用方式 & 调用顺序
2017/02/19 Javascript
详解Node.js 命令行程序开发教程
2017/06/07 Javascript
解决vue-cli webpack打包后加载资源的路径问题
2018/09/25 Javascript
turn.js异步加载实现翻书效果
2019/07/25 Javascript
kafka调试中遇到Connection to node -1 could not be established. Broker may not be available.
2019/09/17 Javascript
多种类型jQuery网页验证码插件代码实例
2021/01/09 jQuery
[02:27]2018DOTA2亚洲邀请赛趣味视频之钓鱼大赛 谁是垂钓冠军?
2018/04/05 DOTA
[00:10]DOTA2全国高校联赛 以DOTA2会友
2018/05/30 DOTA
Django 路由系统URLconf的使用
2018/10/11 Python
利用Python正则表达式过滤敏感词的方法
2019/01/21 Python
Python之Django自动实现html代码(下拉框,数据选择)
2020/03/13 Python
Python OpenCV实现测量图片物体宽度
2020/05/27 Python
Python自动化xpath实现自动抢票抢货
2020/09/19 Python
维多利亚的秘密官方网站:Victoria’s Secret
2018/10/24 全球购物
什么是smarty? Smarty的优点是什么?
2013/08/11 面试题
简历上的自我评价怎么写
2014/01/28 职场文书
环卫处个人工作总结
2015/03/04 职场文书
搞笑的婚礼主持词
2015/06/29 职场文书
幼儿园教师教育随笔
2015/08/14 职场文书
《领导干部从政道德启示录》学习心得体会
2016/01/20 职场文书
linux下导入、导出mysql数据库命令的实现方法
2021/05/26 MySQL
深入浅析Django MTV模式
2021/09/04 Python
HTML怎么设置下划线?html文字加下划线方法
2021/12/06 HTML / CSS
动作冒险《Hell Is Us》将采用虚幻5 消灭怪物探索王国
2022/04/13 其他游戏