Vue.js教程
4.2.2 起步
阅读(

Vue.js 基础

Vue.js 过渡和动画

Vue.js 可复用性和组合

Vue.js 工具

Vue.js 生产环境部署

Vue.js 单文件组件

介绍

起步

例子沙箱

如果你希望深入了解并开始使用单文件组件,请来 CodeSandbox看看这个简单的 todo 应用

针对刚接触 JavaScript 模块开发系统的用户

有了.vue组件,我们就进入了高级 JavaScript 应用领域。如果你没有准备好的话,意味着还需要学会使用一些附加的工具:

  • Node Package Manager (NPM):阅读Getting Started guide直到10: Uninstalling global packages章节。
  • Modern JavaScript with ES2015/16:阅读 Babel 的Learn ES2015 guide。你不需要立刻记住每一个方法,但是你可以保留这个页面以便后期参考。

在你花一天时间了解这些资源之后,我们建议你参考webpack模板。只要遵循指示,你就能很快地运行一个用到.vue组件,ES2015 和热重载 (hot-reloading) 的 Vue 项目!

想学习更多 webpack 的知识,请移步它们的官方文档以及webpack learning academy。在 webpack 中,每个模块被打包到 bundle 之前都由一个相应的“loader”来转换,Vue 也提供vue-loader插件来执行.vue单文件组件 的转换。

针对高级用户

无论你更钟情 webpack 或是 Browserify,我们为简单的和更复杂的项目都提供了一些文档模板。我们建议浏览github.com/vuejs-templates,找到你需要的部分,然后参考 README 中的说明,使用vue-cli工具生成新的项目。

模板中使用webpack,一个模块加载器加载多个模块然后构建成最终应用。为了进一步了解 webpack,可以看官方介绍视频。如果你有基础,可以看在 Egghead.io 上的 webpack 进阶教程

如果本教程对您帮助很大,请随意打赏。您的支持,将鼓励我们提供更好的教程!

← 键盘方向键翻页 →
返回顶部 手机访问 关注微信 返回底部

扫码访问歪脖网

随时随地,想看就看

关注歪脖网微信

分享 web 知识、交流 web 经验