Vue3-01-创建项目

最新推荐文章于 2024-04-11 17:06:48 发布
最新推荐文章于 2024-04-11 17:06:48 发布
阅读量309 收藏
点赞数
分类专栏： Vue3 文章标签： vue3 创建项目
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_39505245/article/details/134857769
版权

环境准备

1.需要用到 16.0 以及更高版本的 node.js
2.使用vscode编辑器进行项目开发


可以在命令行中查看node的版本号:
node -v

在这里插入图片描述

创建项目

1.准备一个目录

例如，我创建项目的时候是在该目录下进行的;

D:\projectsTest\vue3project

2.执行创建命令（*）

npm create vue@latest

在这里插入图片描述

3.使用vscode打开创建的项目

项目刚创建完成后的目录结构如下：
此时只有基本的文件，并没有node_modules
了解本专栏 订阅专栏 解锁全文 超级会员免费看
NorthCastle
关注
专栏目录
订阅专栏
报错：Cannot find type definition file for ‘node‘
Code_code^_^的博客
07-17 2646
在项目目录中执行命令。
webpack理解
Vera_Gao的博客
05-24 657
webpack 核心概念 Entry 入口起点(entry point)指示 webpack 应该使用哪个模块,来作为构建其内部依赖图的开始。 进入入口起点后,webpack 会找出有哪些模块和库是入口起点（直接和间接）依赖的。 每个依赖项随即被处理,最后输出到称之为 bundles 的文件中。 Output output 属性告诉 webpack 在哪里输出它所创建的 bundles,以及如何命名这些文件,默认值为 ./dist。 基本上,整个应用程序结构,都会被编译到你指定的输出路径的文件
Root file specified for compilation Vetur
weixin_45815479的博客
03-14 3086
The file is in the program because: Imported via './components/Count.vue' from file 'c:/Users/10638/Desktop/vue_test/src/App.vue' Root file specified for compilation 今天在App.vue组件中导入Count定义的Count组件时发生的错误 提示：'c:/Users/10638/Desktop/vue_test/src/component
vuetools-main build时webpack-env依赖报错问题处理
wxlll123的博客
08-18 686
vuetools
vue3项目控制台包错The file is in the program because: Root file specified for compilation
fury的博客
01-06 1708
遇见这个错误是因为script标签没有写lang='ts'
vue-cli-plugin-component-创建组件的Vue CLI 3插件-Vue.js开发
05-27
vue-cli项目的vue-cli-plugin-component组件插件│README.md│LICENSE（可选）└───src│├──index.js│└───components│vue-cli-plugin-component组件vue-cli项目的插件│README.md│LICENSE（可选）└─...
vue使用vue-cli快速创建工程
01-19
vue-cli 是一个官方发布 vue.js 项目脚手架，使用 vue-cli 可以快速创建 vue 项目。 -g代表全局安装。 i就是install的缩写。 其中webpack-simple代表模板的名称。vue-todos是你给自己的项目起的名称，这个随便起...
Vue使用vue-cli创建项目
01-19
本文介绍了Vue使用vue-cli创建项目，分享给大家，具体如下： vue-cli 是一个官方发布vueJS项目脚手架：https://github.com/vuejs/vue-cli 我创建的模板项目：...
vue-styled-components-example:带Vue的样式化组件示例
03-11
使用Vue-CLI 3创建Vue项目 vue create vue-styled-components-example cd vue-styled-components-example 添加vue样式的组件 yarn add vue-styled-components 用法 基本的 带模板的Vue组件 // ./src/components/Page...
vue-workflow-chart：使用Vue.js创建工作流图
02-03
作为一个开源项目，vue-workflow-chart受GPLv3-许可。 要求 npm 安装 只需获得 npm i vue-workflow-chart 以获取最新版本。 例 具有两个状态以及从一个状态到另一个状态的过渡的最小示例。 < templat
Cannot find type definition file for ‘q‘. The file is in the program because: Entry point for
最新发布
.伊泽瑞尔
04-11 369
Cannot find type definition file for 'q'. The file is in the program because: Entry point for
安装完typescript 执行tsc报错
chen_come_on的博客
01-17 1688
安装完typescript 执行tsc报错 全局安装: npm install -g typescript 安装后执行tsc后报错： tsc : 无法加载文件 C:\Users\杨晨\Desktop\code\npm\tsc.ps1，因为在此系统上禁止运行脚本。有关详细信息，请参阅 https:/go.microsoft.com/fwlink/?LinkID=135 170 中的 about_Execution_Policies。 + tsc --init + ~~~ + Cate
vscode中vue项目中修改.vue文件名后报错
m0_46829545的博客
09-17 2281
vscode中vue项目中修改.vue文件名后报错
vite-plugin-federation踩坑
yanyihan16的博客
05-11 4376
前言 项目即将用到vite-plugin-federation，开始参照网上的教程和vite-plugin-federation的官方文档试验最简单的微前端。 这里主要参照 VUEShenzhen 在 掘金和 知乎 上的文章去实现 下面是我照以上文章所作的尝试 一、准备工作 1、项目搭建 搭建两个vite项目 在自己的项目目录下打开cmd执行npm create vite@latest 分别创建vite-host 和vite-remote两个项目，目标是vite-remote 进入项目，并执行np
The file is in the program because: Imported via xxx Root file specified for compilation Vetur(1261)
学习前端这门手艺，栈底到栈顶依次是：浏览器架构、Web 网络、事件循环机制、JavaScript 核心、V8 的内存管理、浏览器的渲染流程、Web 安全、CSS、React、Vue、Node、构建工具链等
04-21 1万+
问题 今天用 vscode 编辑器编写 vue 组件的时候， 由于自己改变了组件的文件名，导致引用组件的时候出现了 Vetur(1261) 的报错，报错现象如下： 解决方式 目前我的解决方式就是：保存好文件之后，关闭 vscode 编辑器，然后在打开就没有报错提醒了。这个问题通常是 vscode 引起的，一般是你很快的重命名了自己的文件。 ......
PostgreSQL数据库中的常见错误
热门推荐
步行者的专栏
11-28 10万+
 我们在操作数据库的时候，我们总会遇到很多错误。下面整理了一下常见的错误。错误1      FATAL: connection limit exceeded for non-superusers      原因：非超级用户的连接数（max_connections - superuser_reserved_connections）超过了设定值      解决办法：增加max_co
安装 npm 出错的问题
安安安
08-27 1万+
1、先在系统上安装好nodejs和npm   sudo apt-get install nodejs-legacy 这一部出错请参考:这里   sudo apt-get install npm 2、升级npm为最新版本   sudo npm install npm@latest -g 3、安装用于安装nodejs的模块n   sudo npm install -g n...
【webpack】安装babel的踩坑之旅
Liz's blog hut.
11-07 5244
Loader用于对模块的源代码进行转换，可以使你在 import 或&amp;amp;amp;quot;加载&amp;amp;amp;quot;模块时预处理文件，可以将文件从不同的语言（如 TypeScript）转换为 JavaScript，或将内联图像转换为 data URL，甚至允许你直接在 JavaScript 模块中 import CSS文件！ 使用loader有三种方式，推荐的使用方式是在 webpack.config.js 文件中进行配置。 modul...
使用webpack构建项目时错误如下解决方案
清晨一场梦
02-27 6008
运行npm run start错误代码如下: PS D:\phpStudy\phpstudy\WWW\jsgame&gt; npm run start &gt; @ start D:\phpStudy\phpstudy\WWW\jsgame &gt; webpack-dev-server --inline --config webpack.dev.js --open D:\phpStudy\p...
Vue-CLI创建项目详细指南
3. **预设选择**：在创建项目时，Vue-CLI会询问你是否使用预设选项（preset）。预设选项可以帮助你快速选择一组默认配置。你可以选择预设的官方模板，也可以自定义配置。 4. **选择特性**：如果你选择自定义配置，...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值