专栏首页前端之攻略vue cli安装步骤 原

vue cli安装步骤 原

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的版本就好了。

(adsbygoogle = window.adsbygoogle || []).push({});

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • 修改npm全局安装的位置 原

    不小心删除了C:\Users\Administrator\AppData\Roaming\npm 的Roaming下面的npm ,然后npm安装怎么都无效,这时...

    tianyawhl
  • vue-cli 3.0 初体验 原

    最近复习了下vue,突然发现vue-cli已经更新到3.0版本了,并且变化蛮大,看来要不停的学习,真是一入前端深似海。

    tianyawhl
  • clientWidth、scrollWidth与offsetWidth的区别详解

    clientWidth、scrollWidth与offsetWidth这三种经常会混淆,举例解释这三种宽度

    tianyawhl
  • 前后端分离之Vue项目构建测试打包发布

    写在开始 其实之前对前后端分离研究过一段时间,中间由于项目进度耽搁也就不了了之了,最近项目中部分使用到了Vue,恰逢前端小伙伴们居然说要使用这个东西,也许是前端...

    小柒2012
  • 如何运行vue项目(维护他人的项目)

    前提: 首先,这个教程主要针对vue小白,并且不知道安装node.js环境的。言归正传,下面开始教程:在维护项目之前,需要把所有的环境搭建好,这里我就不多说了...

    王小婷
  • vue.js入门

    用户3055976
  • Vue + Element UI 实现权限管理系统 前端篇(一):搭建开发环境

    Visual Studio Code 是一款非常优秀的开源编辑器,非常适合作为前端IDE, 根据自己的系统下载相应的版本进行安装。

    朝雨忆轻尘
  • Vue2.0搭建脚手架流程

    Vue.js是一套构建用户界面的渐进式框架。 Vue 只关注视图层,采用自底向上增量开发的设计。 Vue 的目标是通过尽可能简单的 API 实现响应的数据绑定和...

    小周sri的码农
  • nodejs基础-nvm和npm

    eadela
  • php面向对象程序设计中self与static的区别分析

    本文实例讲述了php面向对象程序设计中self与static的区别。分享给大家供大家参考,具体如下:

    砸漏

扫码关注云+社区

领取腾讯云代金券