什么是脚手架?
众所周知,前端项目的开发越来越多,我们前端程序员从0开始构建一个完整的项目是很费时间的,所以前端项目的手脚就在这个时候出现了。
我使用vue-cli作为其中之一,我不能告诉你其他任何事情。我就说说这个我接触比较多的vue-cli。
然而,所有手脚支架的核心是快速构建一个完整的项目结构。开发人员只需要在生成的项目结构基础上进行开发,非常简单高效。
其次,vue-cli的脚手架项目模板包括browserify和webpack,vue-lic将预定义的模板(存储在不同的服务器上)本地复制作为项目的初始结构。官网给出了两个模板:webpack-simple和webpack。
两者的区别在于webpack-simple不包含Eslint check等功能。使用webpack就足够了——对于普通项目来说很简单。
我在用wbpack。
至于能不能打造一套手脚,这是肯定的。你只能写一个模板放在github上。在以后的项目中,可以用自己的手脚架。
使用vue-cli
这里因为我用的代码编辑器是vs代码,所以我会按照vs代码的界面来显示;
下面提到的其他命令也可以用在带有终端的其他代码编辑器中
步骤1:安装虚拟命令行界面
npm安装-g vue-CLI
安装完成后,您可以使用命令
Vue列表,查看哪些模板可以调用;
步骤2:建立项目目录
命令格式:vue init模板-名称项目-名称
模板名称:指上面的很多模板;
项目名称:指你自己项目的名称;
例如,我使用模板webpack: vue init webpack vuetest
步骤3:安装依赖项
输入新创建的文件夹:
命令格式:cd vuetest
在文件夹中安装依赖项
命令格式:npm安装
注意:
不需要用cnpm淘宝包管理器安装依赖项,这样会少很多东西;
虽然用npm下载依赖很慢,毕竟是和国外链接连接的;
以下是你此后的经历:
第四步:直接跑
命令格式:npm运行开发
可以直接在终端输入这个命令;
默认为本地端口8080:
这里没问题!
使用网页模板搭建的vue项目目录还可以;
注意:
当运行npm run dev时,可以改为使用Cnpm run dev。
在…之中
安装cnpm
npminstall-gcnpm-registry=https://registry.npm.taobao.org命令。
其他用法不如npm。
以上就是本文的全部内容。希望对大家的学习有帮助,支持我们。