vue 2.0创建新项目

参考链接  https://segmentfault.com/a/1190000011275993

背景在安装完node的基础上,机器什么都没安装参考上述链接

一、下载vue

$ cnpm install vue

二、全局安装脚手架

$ cnpm install --global vue-cli

三、切换到想要创建项目的目录如我想在F盘下面创建项目

f:

四、在盘符f盘下创建项目my-project,创建完成之后会有一系列的注释需要填写,例如项目名称,作者名等等,嫌麻烦可以用下面第二种simple

$ vue init webpack my-project
$ vue init webpack-simple my-project

五、安装依赖

  npm install

六、运行项目

npm run dev 

 

 

转载于:https://www.cnblogs.com/iwen1992/p/10675463.html

创建 Vue.js 2.0 项目可以通过多种方式实现,具体取决于项目的复杂度和开发需求。以下是几种常见方法: ### 使用 Vue CLI 创建项目 Vue CLI 是一个官方提供的命令行工具,用于快速搭建 Vue 项目的基础结构。它提供了开箱即用的配置和插件系统。 1. 安装 Vue CLI: ```bash npm install -g @vue/cli ``` 2. 创建新项目: ```bash vue create my-project ``` 这里 `my-project` 是你的项目名称。CLI 会提示选择预设或手动选择特性(如 Babel、路由、Vuex 等)。 3. 进入项目目录并启动开发服务器: ```bash cd my-project npm run serve ``` ### 手动创建简单项目 如果希望更深入了解 Vue 的工作原理,可以手动创建一个简单的项目结构。 1. 引入 Vue.js: 在 HTML 文件中通过 `<script>` 标签引入 Vue 2.0 的 CDN 链接。 ```html <script src="https://cdn.jsdelivr.net/npm/vue@2"></script> ``` 2. 创建 Vue 实例: ```html <div id="app"> {{ message }} </div> <script> new Vue({ el: '#app', data: { message: 'Hello Vue!' } }) </script> ``` ### 使用 Webpack 或其他构建工具 对于需要高度定制化构建流程的项目,可以使用 Webpack、Vite 或其他构建工具结合 Vue 2.0 开发。 1. 初始化项目并安装依赖: ```bash npm init -y npm install vue@2 npm install --save-dev webpack webpack-cli ``` 2. 创建 `src/main.js` 并编写 Vue 实例: ```javascript import Vue from 'vue' import App from './App.vue' new Vue({ el: '#app', render: h => h(App) }) ``` 3. 配置 Webpack 并运行开发服务器: 可以参考官方文档或其他社区资源来完成 Webpack 的详细配置。 ### 项目结构建议 无论是通过 Vue CLI 还是手动创建,建议采用以下基本文件结构: ``` my-project/ ├── public/ │ └── index.html ├── src/ │ ├── main.js │ ├── App.vue │ └── components/ │ └── MyComponent.vue ├── package.json └── webpack.config.js (仅适用于自定义构建) ``` 通过这些方法,可以灵活地根据实际需求选择适合的方式来创建 Vue.js 2.0 项目
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值