vue-创建vue项目

最新推荐文章于 2023-10-28 08:00:00 发布
最新推荐文章于 2023-10-28 08:00:00 发布
阅读量263 收藏
点赞数
分类专栏： vue
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_45736498/article/details/107247124
版权

创建vue项目

使用命令创建vue

  1. 安装node

  2. 安装vue npm install -g @vue/cli

  3. 创建项目

    1. vue create my-project

    2. 进入后可以看到两个选项

    在这里插入图片描述

    default 自动

    Manually 手动

    我们选择手动

    1. 选择手动进入下一个界面

在这里插入图片描述

  > - Babel ： 编译
  > - TypeScript ： 使用 TypeScript 语言
  > - Progressive Web App (PWA) Support ：渐进式web开发
  > - Router：  路由
  > - Vuex：状态管理
  > -  CSS Pre-processors：css预处理器
  > - Linter / Formatter ：代码格式化 （有强迫症建议不要选）
  > - Unit Testing ，Unit Testing：单元测试

  按空格可以选择
  1. 选择完成后进入下一个界面

在这里插入图片描述
> - In dedicated config files 单独的文件
> - In package.json 所有的配置放在一个文件下

  1. 选择一个进入下一个界面

在这里插入图片描述

  > 是否要保存改配置
  1. 选择y

在这里插入图片描述

  > 给文件起名

  1. 下一步如果安装了其他编译方式可以经行选择

  2. 创建完成

在这里插入图片描述

  • 目录介绍
    • git ：git项目管理
    • node_modules：node 的依赖包
    • public : 静态文件
    • src ：工作目录
    • gitignore：git需要忽视的文件
    • babel.config.js：编译的配置
    • package.json、package-lock.json：依赖的配置文件、
    • README.md :操作文档

vue ui 创建项目

  1. 在命令窗口输入 vue ui

在这里插入图片描述

  1. 打开创建vue的ui界面

在这里插入图片描述

  1. 点击创建项目 更具提示创建
passerby_Ai
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
如何搭建一个vue项目(完整步骤)
qq_39093474的博客
09-11 2万+
这里如果选择保存的话，就要输入名字，默认就是文件夹的名字，下次配置的时候就会显示这个文件配置的选项就像上面的一样，在配置的时候会多出来一个。）下载hbuildx安装文件（已提供，无需下载），下载后，直接解压就可以使用。代码检查，选标准的就行，方向键切换，空格键选择然后回车。按空格键选择要安装的配置资源，带 * 号说明被选上了。上下方向键选择版本，这里我们选择vue2，然后回车。代码检查时间，方向键切换，空格键选择然后回车。启动成功之后，打开路径看到如下界面说明成功。通过上下方向键选择对应配置，然后回车。
新建vue项目时的webpack大坑：DeprecationWarning: Unhandled promise rejections are deprecated. precated.
just a moment
08-11 5073
报错信息： 想要启动项目输入npm run dev后的报错信息 DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code. 报错原因： 新建的vue项目，由于less-loader版本（在package.
怎样创建一个VUE项目（超简单）
热门推荐
m0_70619994的博客
09-25 7万+
一、安装node.js 二、搭建vue环境 1、全局安装@vue/cli模块包 2、执行命令 3、检查是否安装成功 三、创建vue项目 1、创建项目 2、选择模板和包管理器，等待项目创建完毕 四、启动vue项目 1、执行命令 2、浏览项目页面 五、vue项目目录文件含义和作用 六、修改端口号 七、清理欢迎界面 补充：解决App.vue 代码是黑白色的方法
如何创建vue项目，创建的方式？
weixin_73184582的博客
04-19 4676
以上就是使用 Vite 工具创建 Vue 项目的方法，Vite 是一个基于 ES Module 的开发工具，可以帮助开发者快速搭建 Vue 项目，并提供了快速热重载、按需加载等功能，可以大大提升开发体验。以上就是使用 Webpack 创建 Vue 项目的方法，虽然需要手动配置比较复杂，但是可以根据需求进行高度的自定义和扩展，是比较灵活和强大的构建工具。首先需要安装 Node.js 和 npm 包管理器，Node.js 官网提供了对应的安装包和指南，可以根据自己的操作系统和版本选择下载和安装。
Vue 项目搭建流程和使用大全
岁月如歌去，十年弹指间
07-21 4万+
Vue 项目搭建流程及项目中遇到的问题 项目搭建流程 1.使用vue cli 搭建项目框架 cnpm install -g vue-cli 安装vue cli 脚手架 vue init webpack projectName 创建项目 cd projectName cnpm install 安装依赖模块 2.使用 vue router cnpm install vue rou...
创建vue项目步骤
zzzz121380的博客
04-02 3703
前提：安装node环境 一、搭建vue项目 1.全局安装vue-cli npm install --global vue-cli 2.进入你的项目目录，创建一个基于 webpack 模板的新项目 [外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-EuyCL3cl-1617344228865)(C:\Users\xuzhenzhen\AppData\Roaming\Typora\typora-user-images\image-20210402134726139.png)] 说明
【创建vue项目的三种方式】
regretTAT的博客
06-06 7185
【代码】【创建vue项目的三种方式】
Vue使用vue-cli创建项目
01-19
本文介绍了Vue使用vue-cli创建项目，分享给大家，具体如下： vue-cli 是一个官方发布vueJS项目脚手架：https://github.com/vuejs/vue-cli 我创建的模板项目：...
vue使用vue-cli快速创建工程
01-19
vue-cli 是一个官方发布 vue.js 项目脚手架，使用 vue-cli 可以快速创建 vue 项目。 -g代表全局安装。 i就是install的缩写。 其中webpack-simple代表模板的名称。vue-todos是你给自己的项目起的名称，这个随便起...
vue-cron_vue-cron_vuecrond组件_vuecron_
10-04
Vue-Cron是一款基于Vue.js开发的时间周期（Cron）表达式组件，用于在前端应用程序中创建、编辑和处理定时任务。Vue-Cron旨在提供一种直观的用户界面，让用户能够通过图形化的方式设置复杂的Cron表达式，从而实现定时...
vue-ydui使用文档
01-11
通过深入学习和实践这份本地的Vue-YDUI使用文档，开发者可以熟练掌握如何利用Vue-YDUI创建高性能、美观的Web应用。无论是初学者还是经验丰富的开发者，都可以从中受益，提升开发效率。同时，建议在项目中保持良好的...
vue 画布 vue-fabric-drawing
最新发布
02-20
7. **安装与使用**：在 Vue 项目中，首先需要通过 npm 或 yarn 安装 vue-fabric-drawingboard，然后在组件中导入并使用。同时，别忘了在 Vue 实例中注册组件，最后在模板中插入画布组件并配置相应的属性。 8. **...
如何使用vue创建一个项目
qq_45475788的博客
08-07 338
打开cmd 输入node -v 和npm -v查看电脑是否已经安装了node,js。下载完成后，打开cmd输入上面图片中的两个指令，查看是否安装成功。命令2：进入项目目录后，输入npm install 进行初始化。如果出现以下截图，则说明已经有node.js，可忽略此步。检查是否安装成功，如果输出版本号则说明安装成功。命令3：输入npm run dev运行项目。命令1：vue create 项目名。如果没有，则打开官网，下载即可。项目创建成功，可在浏览器中查看。使用vue-cli3创建项目。
npm创建vue项目
qq_41425194的博客
07-01 5519
可通过官网下载：https://nodejs.org/en/创建一个自己的文件夹，在文件夹所创建的位置下，搜索cmd打开终端命令行输入命令：npm install -g @vue/cli1.输入命令 vue create demo01（vue create + 文件名）正在上传…重新上传取消 2.创建途中选择第一个即可3.在编译软件中通过cmd打开项目，系统命令行运行npm输入命令 npm run server...
Vue-7.命令创建Vue项目
yueerba126的博客
08-15 3178
创建一个简单的 Vue 项目需要使用 Vue CLI（命令行界面）。Vue CLI 是一个用于快速构建 Vue.js 项目的工具，它可以帮助你设置项目的基本结构、配置以及开发环境。
vue 创建新项目
weixin_44161385的博客
02-11 3万+
vue创建新项目的几种方式
从零开始搭建一个vue项目（保姆级教程）
weixin_50989469的博客
07-23 4350
我这边在本地起了一个后台服务（建议后台服务做好跨域配置），模拟接口访问调用，一共测试了三种方式：①get无参请求 ②get有参请求 ③post请求json传参。新建api文件夹，放在api文件夹下，需要引入http文件，js文件地址：src/api/pageB.js。项目建好之后，就可以配置ui组件了，可以选择npm去装，也可以选择yarn安装，我把两个命令都列出来了。第二步，选择【Vue.js】，输入自己项目的名称，点击【Create】生成项目。在main.js中import之后，ui组件才正式生效。
前端开发技术栈（工具篇）：Vue/Node.js项目构建和包管理器npm的使用以及命令详解
SteveRocket's-Blog
10-28 3536
npm 是一个强大的包管理工具，它使开发人员能够轻松地安装、更新和管理项目依赖的包。通过初始化一个package.json 文件，你可以描述你的项目并记录其依赖关系。使用 npm install 命令，你可以安装和管理包。使用 npm publish 命令，你可以发布自己的包到 npm 注册表。无论是在开发过程中还是在分享你的包时，npm 都提供了丰富的功能和命令来满足你的需求。
vue-cli创建vue项目
07-28
您可以使用以下步骤在Vue项目中使用vue-cli进行创建： 1. 首先，确保您已经安装了Node.js和npm。您可以通过在终端中运行以下命令来检查它们是否已安装： ``` node -v npm -v ``` 如果没有安装，请前往Node.js官方网站（https://nodejs.org/）下载并安装。 2. 安装vue-cli。在终端中运行以下命令： ``` npm install -g @vue/cli ``` 这将全局安装Vue CLI。 3. 创建新的Vue项目。在终端中导航到您想要创建项目的目录，并运行以下命令： ``` vue create project-name ``` 将“project-name”替换为您希望为项目选择的名称。 4. 在创建项目时，Vue CLI会提示您选择一些配置选项。您可以根据需要进行选择，或者使用默认选项。一旦选择完成，项目的基本结构和依赖项将自动生成。 5. 进入到新创建的项目目录中： ``` cd project-name ``` 6. 启动开发服务器。运行以下命令： ``` npm run serve ``` 这将启动一个本地开发服务器，并在浏览器中显示您的Vue应用程序。 这样，您就成功使用vue-cli创建了一个新的Vue项目。您可以根据需要修改和扩展该项目。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值