如果使用脚手架创项目

如果使用脚手架创项目
什么是脚手架:具有核心功能的半成品代码,只需要向其中添加个性化自定义内容即可
(1)默认安装好node.js v8.11.1 >
(2)全局安装vue-cli:

   npm i -g vue-cli  

(3)初始化一个项目,指定打包工具 webpack(在你想要的安装的目录下)

  vue init webpack app                      // app是自定义项目名称
 安装时会问
  ? Project name   直接回车
  ? Project description   直接回车
  ? Author            作者
  ? Install vue-router[文华帐本]
  ? Use ESLint to lint your code?      安装ESLint 代码检查  选择no
  ? Set up unit tests                是否安装单元测试
  ? Setup e2e tests with Nightwatch? 测试工具   可选可不选

在这里插入图片描述
最后回车就开始安装了
会生成 package.json文件
(4)项目目录生成
//(5)进入项目录目录安装依赖第三方模块(最新的不需要这一步)

#  npm i

(6)启动项目

  npm run dev

(8) http://localhost:8080/#/

  停止工作 ctrl+c

目录结构
在这里插入图片描述
build: 保存基本配置文件(webpack)
src: 我们项目所有源代码(vue;js;css;image;…)
static: 静态目录
package.js 项目的描述文件

使用Vue脚手架项目非常方便。首先,你需要下载并安装Vue脚手架工具。在命令行窗口中输入以下命令进行安装:npm i -g @vue/cli [1] 安装成功后,进入你想要项目的目录,然后执行以下命令:vue create 项目名称 [2] 接下来,你将会被要求进行一系列配置选项。你可以根据自己的需求选择配置项,并按照提示进行选择。例如,你可以选择使用手动配置或者自动配置,选择需要使用的工具,选择ESLint语法版本等等。一旦完成了所有的配置选项,一个基础的Vue项目就会被建出来 [1。 完成项目建后,进入项目目录,并在命令行中运行npm run serve命令,即可启动项目的开发服务器。然后,在浏览器中打开相应的URL地址,你就可以看到你建的Vue项目了 [1。 总结来说,使用Vue脚手架项目可以帮助你快速搭建一个Vue项目的基础结构,省去了繁琐的配置和安装过程,让你可以直接开始编写自己的代码 [1。<span class="em">1</span><span class="em">2</span><span class="em">3</span> #### 引用[.reference_title] - *1* [使用脚手架建Vue项目](https://blog.youkuaiyun.com/qq_43218707/article/details/106302074)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 50%"] - *2* *3* [【Vue 快速入门】使用vue脚手架建一个项目](https://blog.youkuaiyun.com/apple_51931783/article/details/128169640)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 50%"] [ .reference_list ]
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值