能不能简单的引入Vue.js和Vue-router来做项目

Question

马上就要做项目可 没时间搞清楚webpack啥的，项目是php后台，前端用vue做首页，商品列表，商品详情，下单，订单列表，订单详情等页面，不知道简单点来行不行

Answer 1

你肯定也知道可以，只是担心这样算不算是个靠谱的 production ready 方案。
答案是“没问题”?????

vuejs.org 中对 vue 的定义的第一段是这么写的

Vue (pronounced /vjuː/, like view) is a progressive framework for building user interfaces. Unlike other monolithic frameworks, Vue is designed from the ground up to be incrementally adoptable.

vue 是一个“渐进式”的框架，是特意设计可以被平滑、逐步的采用的。再多往下翻上一会儿，你会发现 vuejs.org 官网指南的 Essentials 部分全是用 script 标签引入的 vue.js ，一直到某些高级主题才会出现例外。（vue-router 也是这样）

现在的前端生态看起来很吓人（也只是看起来），但都是提高生产力的进步，如果不是时间精力受限太厉害的话，建议还是尽量学习拥抱。生产力工具、先进理念上图简单只能作为权宜之计。

“渐进式”概念相关资料：Vue作者尤雨溪：Vue 2.0，渐进式前端解决方案

Answer 2

当然可以，再加上gulp这类打包工具来处理一下图片啊之类的，直接用Vue可行

Answer 3

$ npm install vue-cli

$ vue list

  Available official templates:

  ★  browserify - A full-featured Browserify + vueify setup with hot-reload, linting & unit testing.
  ★  browserify-simple - A simple Browserify + vueify setup for quick prototyping.
  ★  simple - The simplest possible Vue setup in a single HTML file
  ★  webpack - A full-featured Webpack + vue-loader setup with hot reload, linting, testing & css extraction.
  ★  webpack-simple - A simple Webpack + vue-loader setup for quick prototyping.

---

如果你不想用 browerify 或者 webpack，可以使用 simple 方案：

$ vue init simple my-project

Answer 4

或者你也可以项我这博客里的这篇章这样。http://blog.zeromake.com/page...

Answer 5

直接在html引用Vue.js和Vue-router，开撸就是啦，so easy!

Answer 6

当然可以咯...

Answer 7

官方不是有10秒开鲁吗？前端不要苦逼把自己往死里整，缺啥补啥

<div id="demo">
  <p>{{message}}</p>
  <input v-model="message">
</div>
<script src="http://cdnjs.cloudflare.com/ajax/libs/vue/1.0.26/vue.min.js"></script>
<script>
var demo = new Vue({
  el: '#demo',
  data: {
    message: 'Hello Vue.js!'
  }
})
</script>

Answer 8

哈哈哈哈哈哈哈哈 10秒开撸 我也想这么干