美文网首页
前端搭建vue项目

前端搭建vue项目

作者: 知文图鉴 | 来源:发表于2019-03-05 10:35 被阅读0次

    1、打开node.js官网https://nodejs.org/en/下载当前版本node.js并安装到电脑中,安装方式为"无脑安装之下一步"

    安装完成后检验是否安装node.js:

            win+r输入cmd打开dos窗口输入node -v回车之后会显示node.js版本号,证明电脑安装成功了!

            npm集成在node.js中,在dos窗口输入npm -v回车之后会显示npm版本!

    2、利用淘宝镜像安装cnpm,在命令行中输入npm install -g cnpm --registry=https://registry.npm.taobao.org,

    安装成功之后输入cnpm install -g vue-cli来安装vue-cli脚手架

    3、开始创建vue项目,例如要在D盘创建vue项目。

            dos命令行输入D: 进到D盘目录cd D:vueProject进入vueProject文件夹,输入vue init webpack projectName创建新的vue项目,其中projectName为项目名称,可设为任意名称。

    回车之后会出现vue项目的配置属性:
            Project name为项目名称
            Project description为项目描述
            Author为项目作者
            Vue build为webpack配置文件默认回车就好
            Install vue-router?是否安装路由配置
            Use ESLint to lint your code?为eslint校验js代码语法的插件(可装可不装)
            Set up unit tests?为设置测试单元默认No就可以
            Setup e2e tests with Nightwatch?为vueE2E测试
            Should we run 'npm install' for you after the project has been created?(recommended)默认npm安装
    例如:

    4、安装项目依赖
            dos窗口定位到项目路径cd D:vueProject\projectName,然后输入cnpm install安装项目所需依赖包资源。

    5、安装成功之后运行
            dos窗口定位到项目路径cd D:vueProject\projectName,然后输入npm run dev回车运行项目,项目路径为http://localhost:8080

    6、编辑器开发工具
            推荐HbuilderX编辑器下载地址:http://www.dcloud.io/hbuilderx.html

    原创文章链接:http://www.zhicaipt.cn/hz_index/view/article_detail.html?id=47

    相关文章

      网友评论

          本文标题:前端搭建vue项目

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