第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號(hào)安全,請(qǐng)及時(shí)綁定郵箱和手機(jī)立即綁定

Vue-cli腳手架快速搭建項(xiàng)目圖文教程

標(biāo)簽:
前端工具 Vue.js

​ 前言:比较基础的教程,大神自行忽略

脚手架是什么?

“脚手架”是一种元编程的方法,用于构建基于数据库的应用。许多MVC框架都有运用这种思想。
程序员编写一份specification(规格说明书),来描述怎样去使用数据库;而由(脚手架的)编译器来根据这份specification生成相应的代码,进行增、删、改、查数据库的操作。我们把这种模式称为"脚手架",在脚手架上面去更高效的建造出强大的应用!

好吧,其实说白点就是可以快速帮你搭建一个项目的基础架子,你直接拿过来用然后添加新项目需要的东西。

准备工作

安装node

首先我们需要安装node环境,官网https://nodejs.org下载安装包。

安装完成后可以,可以命令行工具中输入 node -vnpm -v,如果能显示出版本号,就说明安装成功。

img

安装 Vue-cli

首先全局安装 vue-cli

npm install -g vue-cli

安装完成后 同样适用命令行工具 输入 vue -V 记住 大写V ! 大写V ! 大写V !

img

生成项目

首先需要在命令行中进入到项目目录,然后输入:

vue init webpack Vue-Project

Vue-Project 是自定义的项目名称,命令执行之后,会在当前目录生成一个以该名称命名的项目文件夹,如下图

img

初始化,安装依赖

如果跟我一样没有立即执行npm装包,那么咱们可以手动 执行去安装依赖

npm install

安装依赖完成

img

run

npm run dev

浏览器打开http://localhost:8080/#/ ,会看到欢迎页:

img

build

npm run build

打包后会生成dist文件夹

img

打开dist文件夹下新生成的index.html文件,会发现页面空白,打开控制台会发现页面中引用的css和js文件都找不到:

img

说明引用路径错了,需要手动修改:

进入config/index.js

img

如果本地的8080端口被占用,可以修改端口号。

打包上线

打包完成后,会生成 dist 文件夹,如果已经修改了文件路径,可以直接打开本地文件查看

项目上线时,只需要将 dist 文件夹放到服务器就行了。

點(diǎn)擊查看更多內(nèi)容
1人點(diǎn)贊

若覺(jué)得本文不錯(cuò),就分享一下吧!

評(píng)論

作者其他優(yōu)質(zhì)文章

正在加載中
感謝您的支持,我會(huì)繼續(xù)努力的~
掃碼打賞,你說(shuō)多少就多少
贊賞金額會(huì)直接到老師賬戶(hù)
支付方式
打開(kāi)微信掃一掃,即可進(jìn)行掃碼打賞哦
今天注冊(cè)有機(jī)會(huì)得

100積分直接送

付費(fèi)專(zhuān)欄免費(fèi)學(xué)

大額優(yōu)惠券免費(fèi)領(lǐng)

立即參與 放棄機(jī)會(huì)
微信客服

購(gòu)課補(bǔ)貼
聯(lián)系客服咨詢(xún)優(yōu)惠詳情

幫助反饋 APP下載

慕課網(wǎng)APP
您的移動(dòng)學(xué)習(xí)伙伴

公眾號(hào)

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號(hào)

舉報(bào)

0/150
提交
取消