暂无图片
暂无图片
暂无图片
暂无图片
暂无图片

WEB前端搭建Vue脚手架并创建一个项目

IT那活儿 2022-04-24
778

点击上方“IT那活儿”,关注后了解更多内容,不管IT什么活儿,干就完了!!!




安装node.js环境


官方网址:http://nodejs.cn/

根据自己电脑系统安装,一直点下一步即可。

安装完成后cmd,输入:

node -vnpm -v

如果能看到node和npm的版本号了,说明已经安装成功




安装vue-cli


下面整个过程是基于已经安装node.js和npm的基础上,如何全局化安装npm:

npm install -g

1)全局安装 vue-cli。

npm install -g vue-cli

2)检查是否安装成功与版本。

出现以上提示表示vue-cli正常安装成功,可以正式创建vue-cli工程项目了。




创建项目


安装vue-cli成功后,通过cd命令进入你想放置项目的文件夹,在命令提示窗口执行创建:

vue init test_dm
*test_dm为项目名。

确认创建项目后,后续还需输入一下项目名称、项目描述、作者、打包方式、是否使用ESLint规范代码等等,详见上图。

安装顺利执行后会,生成如下文件目录:

生成文件目录后,使用 cnpm 安装依赖:npm install

最后需要执行命令:npm run dev 来启动项目,启动完成后会自动弹出默认网页:

到这一步,就算成功利用vue-cli搭建一个vue项目了~

注:

  • build webpack文件,配置参数,打包的代码存放在这里。

  • config  vue项目的基本配置文件。

  • node_modules 项目中安装的依赖模块。



本文作者:池思敏

本文来源:IT那活儿(上海新炬王翦团队)

文章转载自IT那活儿,如果涉嫌侵权,请发送邮件至:contact@modb.pro进行举报,并提供相关证据,一经查实,墨天轮将立刻删除相关内容。

评论