安装 vue

作者：冫LOVE灬丶棒棒发布日期:2026-02-21 浏览:100

# 安装 Vue CLI
npm install -g @vue/cli

# 创建一个新的 Vue 项目
vue create my-project

# 进入项目目录
cd my-project

# 启动开发服务器
npm run serve

解释说明：

安装 Vue CLI：使用 npm install -g @vue/cli 命令全局安装 Vue CLI 工具，这样你可以在命令行中使用 vue 命令。
创建一个新的 Vue 项目：通过 vue create my-project 命令创建一个名为 my-project 的新 Vue 项目。你可以根据提示选择预设配置或手动配置项目。
进入项目目录：使用 cd my-project 进入新创建的项目目录。
启动开发服务器：运行 npm run serve 启动开发服务器，默认会在 http://localhost:8080 上运行你的应用。

如果你不希望安装 Vue CLI，也可以直接在 HTML 文件中通过 CDN 引入 Vue：

<!DOCTYPE html>
<html>
<head>
  <title>My Vue App</title>
  <script src="https://cdn.jsdelivr.net/npm/vue@2"></script>
</head>
<body>
  <div id="app">
    {{ message }}
  </div>

  <script>
    new Vue({
      el: '#app',
      data: {
        message: 'Hello Vue!'
      }
    });
  </script>
</body>
</html>

解释说明：

通过 <script> 标签引入 Vue.js 库。
使用 new Vue() 创建一个新的 Vue 实例，并将其挂载到具有 id="app" 的 DOM 元素上。
在 data 中定义了一个 message 变量，并在模板中通过双大括号 {{ message }} 显示其值。

上一篇：vue3watch监听多个变量

下一篇：vue3+vite+ts