Vue安装以及项目搭建

    技术2022-07-13  98

    Vue从入门到入土系列

    一只不务正业的Java后端码畜今天又来研究前端Vue了。

    1、要搭建运行Vue项目,首先得安装一个东西叫Node。网上有很多教程这里推荐博主使用的菜鸟教程。传送门》》》》

    当你安装成功后测试一下安装是否成功,npm包含在Node里面的,一般安装成功就有>>>>如下:

    2、当把Node.js安装好以后就可以着手创建Vue项目了。由于 npm 安装下载速度特别慢,我们一般可以使用淘宝的镜像及其命令 cnpm来下载Vue以及相关项目依赖。

    安装淘宝镜像 npm install -g cnpm --registry=https://registry.npm.taobao.org

    当然npm 版本需要大于 3.0,如果低于此版本需要升级它: cnpm install npm -g


    安装Vue-cli, vue的脚手架。 cnpm install vue-cli -g
    然后我们测试一下vue-cli是否安装成功,显示下图表示安装成功。 vue list

    3、新建vue项目,首先我们新建项目地址。

    我在R盘新建项目,然后进入对应文件夹开始新建项目。
    新建项目,记得下面三个选No, 第一个是关闭eslint校验。这个是个代码规范插件。会严格规范你的代码。空格缩进都会报错,一般默认就选No,当让你也可以严格要求自己。手动滑稽。第二个单元测试和第三个是e2e单元测试。默认都是选的No。别人都是选的No,咱也选No吧。 vue init webpack "项目名称"


    cd进入项目包,为你的下载相关vue依赖文件。 cnpm install

    如果你成功走到这儿说明你已经成功了。我们来试试运行我们新建的Vue项目吧。以下便是项目访问地址。copy到浏览器试试。 cnpm run dev


    这便是已经成功搭建了。

    我们再来看看我们的项目目录。可以看到一个项目已经搭建好了。继续开发成我们想要的样子。


    一直不务正业的后端码畜。初try vue,非专业。如有贻误望指正。谢谢支持!
    Processed: 0.009, SQL: 9