美文网首页
vue.js安装小知识

vue.js安装小知识

作者: Shaw_Chen | 来源:发表于2018-02-08 17:22 被阅读0次

    安装vue-cli步骤:

    1.npm install -g vue-cli //全局安装vue-cli

    2.vue init webpack projectName //生成项目名为projectName的模板,这里的项目名

    3.projectName //项目名称

    4.cd projectName //进入项目文件

    5.npm install //初始化安装依赖

    注意:如果npm安装失败,直接用命令清理就行,控制台输入:

    npm cache clean --force,然后重新安装。

    安装成功后的目录

    上述完成后,我们就完成vue的项目就已经生产完成,当我们运行localhost:8080就能看见如下图的vue官方logo:

    首页

    特别提醒:

    在新版本的Vue开发中,通过vue-cli创建的build文件夹下面已经没有了旧版本中的dev-server.js文件,那么如果我么需要将旧项目升级需要添加一些路由设置该怎么办呢??

    答:新版本的vue已将dev-server.jswebpack.dev.conf.js合并,若要写路由相关配置需要找到webpack.dev.conf.js中的devServer对象进行相关配置。

    新版本的Vue 的build文件夹

    进行后台数据模拟,具体步骤如下:

    第一步,在const portfinder =require(‘portfinder’)后添加

    1

    第二步:找到devServer,在里面加上before()方法

    2

    接着提供一个json.data数据

    PS:

    所有的修改配置都需要重新启动运行命令的:npm run dev才能生效(很重要,否则无法请求到数据)

    相关文章

      网友评论

          本文标题:vue.js安装小知识

          本文链接:https://www.haomeiwen.com/subject/qupttftx.html