Vue 脚手架是一个官方提供的基于 Webpack 模板的快速启动工具。通过使用 Vue 脚手架,可以方便地创建和管理 Vue.js 项目。Vue 脚手架提供了默认配置,还有一些插件可以根据需要安装。
使用 Vue 脚手架创建 Vue 项目非常简单。首先需要安装 Vue 脚手架。在终端中运行以下命令:
npm install -g vue-cli
安装完成后,可以通过以下命令创建一个新的 Vue 项目:
vue init webpack my-project
此命令将会创建一个名为 my-project 的文件夹,并在其中创建 Vue 项目结构。在 my-project 目录中运行以下命令来启动服务:
cd my-project
npm install
npm run dev
现在,在浏览器中打开 http://localhost:8080,就可以看到项目的初始页面了。
直接引入 Vue.js 文件也是一种创建 Vue 项目的方法。它适用于较小的项目,或者仅仅是用来通过 CDN 引入的一些示例代码。在 HTML 文件中引入以下内容:
<script src="https://cn.vuejs.org/js/vue.js"></script>
现在就可以在 HTML 中使用 Vue 了,例如:
<div id="app">
{{ message }}
</div>
<script>
var vm = new Vue({
el: '#app',
data: {
message: 'Hello Vue!'
}
});
</script>
这将在页面上显示“Hello Vue!”。