• 设为首页
  • 点击收藏
  • 手机版
    手机扫一扫访问
    迪恩网络手机版
  • 关注官方公众号
    微信扫一扫关注
    迪恩网络公众号

Vue+TypeScript+Vuex+Element-ui项目创建

原作者: [db:作者] 来自: [db:来源] 收藏 邀请

1、安装node:

https://nodejs.org/zh-cn/download/ ,根据自己对应的系统下载对应的版本,建议下载zip文件,安装后把安装路径放到环境变量的path里面,然后打开命令窗口查看是否安装正常,如下:

2、安装npm:推荐cnpm代替npm,安装命令如下:

   npm install -g cnpm --registry=https://registry.npm.taobao.org

3、安装vue cli,命令如下:

         npm install -g @vue/cli

安装完成后可以打开命令窗口查看,如下:

4、安装依赖typescript,命令如下:

        cnpm i -g @vue/cli typescript

安装完成后可以打开命令窗口查看,如下:

5、去对应的项目路径下新建自己对应的项目文件夹,然后就可以创建项目,打开命令窗口找到创建的文件夹,输入如下命令:

        vue create 项目名称

然后选择 Manually select features,如图:

选择自己项目需要用到的,这个是我自己项目上用到的(可以根据自己项目选择):

然后回车,一直Yes下去,然后到这一步选择标准版本,如下:

然后回车,接着往下,如下图选择json格式(可以根据自己项目选择):

然后一直回车就会进行项目创建和依赖加载,如下:

依赖加载完成,如下:

6、找到对应的路径就能找到创建的项目:

7、打开命令窗口,找打对应的项目路径,安装element-ui依赖,命令如下:

     cnpm i element-ui –S

8、打开命令窗口,运行如下命令:

     Vue ui

9、把项目导入到Vue项目管理器中:

然后就可以运行自己的项目:

10、运行后在输出查看项目是否正常,如下:

访问地址,项目启动成功,如下:

11、使用开发工具打开项目文件如下,说明该项目已经支持ts文件:

12、调试Vue的时候建议安装:vue-devtools工具。


鲜花

握手

雷人

路过

鸡蛋
该文章已有0人参与评论

请发表评论

全部评论

专题导读
上一篇:
webpack构建多页面react项目(webpack+typescript+react)发布时间:2022-07-18
下一篇:
TypeScript学习笔记(二)-基本类型发布时间:2022-07-18
热门推荐
热门话题
阅读排行榜

扫描微信二维码

查看手机版网站

随时了解更新最新资讯

139-2527-9053

在线客服(服务时间 9:00~18:00)

在线QQ客服
地址:深圳市南山区西丽大学城创智工业园
电邮:jeky_zhao#qq.com
移动电话:139-2527-9053

Powered by 互联科技 X3.4© 2001-2213 极客世界.|Sitemap