文档章节

vue cli安装步骤

tianyawhl
 tianyawhl
发布于 2017/09/12 10:42
字数 373
阅读 7
收藏 0

1、全局安装 vue-cli
     npm install --global vue-cli
2、创建一个基于 webpack 模板的新项目
     vue init webpack my-project
3、切换到项目文件夹安装依赖
      $ cd my-project
      $ npm install
     但是在进行到$ npm install时 总是错误Failed at the phantomjs-prebuilt@2.1.15 install script 'node install.js
    这时需先安装phantomjs-prebuilt
    npm install phantomjs-prebuilt@2.1.15 --ignore-scripts
    再npm install
4、npm run dev

5、生成dist文件夹,npm run build

把生成的dist文件夹的内容上传到http服务器上就可以通过 http来访问了

.vue文件高亮显示

默认情况下,Vue.js 的单文件组件(*.vue)在 sublime 编辑器中是不被识别的。若要想高亮显示,需要安装插件 Vue Syntax Hightlight。安装步骤如下: 
第一,在 sublime 中打开 PackageControl 快捷键 Ctrl+Shift+P,或者在菜单Tools->Command Palette
第二,打开 Install Package 窗口,回车。 
第三,输入vue找到相应的插件,回车安装 

.vue文件格式化

 点击Install Package,然后搜索HTML-CSS-JS Prettify,按确定,等待安装结束。

安装HTML/CSS/JS Prettify后 : 
tools->HTML/CSS/JS Prettify->Pligin Options-Default 
在”allowed_file_extensions”: [“htm”, “html”, “xhtml”, “shtml”, “xml”, “svg”,”vue”] 加上vue就好了
 

如果从github下载别人的例子,前面的安装都很顺利,最后一步npm run dev出现莫名奇妙的错误(如显示{}异常)可以把node重新安装新的版本,我之前一直显示错误,之前的版本是5点几的版本,重新安装了6.1的版本就好了。

© 著作权归作者所有

共有 人打赏支持
tianyawhl
粉丝 2
博文 215
码字总数 109205
作品 0
常州
前端工程师
私信 提问
VSCode 搭建Vue开发环境之Vue CLI

一、简介说明 1.关于VS Code开发工具,安装和配置,更多可以参考以前文章 2.关于Vue.js,Vue是一个优秀的渐进式前端框架,不仅易于上手,还便于与第三方库或既有项目整合。 3.关于Vue是使用方...

tianma3798
09/26
0
0
vue-cli 3.0 初体验

最近复习了下vue,突然发现vue-cli已经更新到3.0版本了,并且变化蛮大,看来要不停的学习,真是一入前端深似海。 安装步骤: 1、全局安装 npm install -g @vue/cli Vue CLI 的包名称由 vue-...

tianyawhl
08/21
0
0
Vue中路由管理器Vue Router使用方式(二)-推荐

一、Vue中使用Vue Router简单方式使用 vue add xxx命令添加插件 使用步骤,本人假设已经安装好了Vue CLI工具,了解更多参考:VSCode 搭建Vue开发环境之Vue CLI 1.创建项目 创建过程比较慢,需...

tianma3798
10/17
0
0
手摸手教你搭建vue-cli脚手架-详细步骤图文解析[vue入门]

写在前面: 使用 vue-cli 可以快速创建 vue 项目,vue-cli很好用,但是在最初搭建环境安装vue-cli及相关内容的时候,对一些人来说是很头疼的一件事情,本人在搭建vue-cli的项目环境的时候也是...

阿K1225
05/22
0
0
Vue CLI 3搭建vue+vuex 最全分析

一、介绍 Vue CLI 是一个基于 Vue.js 进行快速开发的完整系统。有三个组件: CLI:@vue/cli 全局安装的 npm 包,提供了终端里的vue命令(如:vue create 、vue serve 、vue ui 等命令) CLI ...

技术小能手
09/28
0
0

没有更多内容

加载失败,请刷新页面

加载更多

延迟队列实现精准的订单超时取消--自我记录备份

订单的超时取消很多系统采用定时任务,实际上达不到要求。我用的是延迟队列,但缺点是只实现了基于jvm的,分布式采用的是修改之前去查询订单状态,以及分布式锁获取的方式来控制,这样获得锁...

checkboxMan
17分钟前
0
0
storm 环境搭建

1.下载解压 下载地址:http://storm.apache.org/downloads.html

MrPei
31分钟前
1
0
Python Base - 读写文件,字符串拼接,单引号

字符转义 读写文件cvs 字符串拼接,替换 import csvcsv_file_name = 'cardbin.csv'# insert into `card_bin_code` (name_of, code_of, card_no_prefix, bank_code) values ('中国银行......

园领T
33分钟前
1
0
基于JQUERY BOOTSTRAP 最简单的loading遮罩层

<%--loading遮罩层--%><div class="modal fade" id="loadingModal" backdrop="static" keyboard="false">   <div style="width: 200px;height:20px; z-index: 20000; position: abs......

颖辉小居
33分钟前
1
0
springboot+kafka

1,首先springboot对kafka的支持也很好,同样是在配置文件中配置好参数,然后就可以直接使用。先说一下,很简单,,,不要怕 2,我用的依赖是 <dependency> <groupId>org.springframewor...

我真是小菜鸡
37分钟前
3
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部