开发人员查看使用SPA，Webpack，身份验证，GraphQL，文档和测试的Vue开发人员的资源。

你准备开始一个重要的Vue项目吗？为了确保从坚实的基础开始，您可以使用模板（也就是样板，骨架，起动器或脚手架）而不是从npm init或开始vue init。

许多经验丰富的开发人员已经掌握了以开源模板的形式构建高质量Vue应用程序的智慧。这些模板包括最佳配置和项目结构，最佳第三方工具以及其他开发最佳实践。

与Vue CLI 3不同，Vue CLI 3针对灵活性进行了优化，因此模板具有观点。因此，重要的是选择符合您的开发理念并且具有开箱即用的大致相同的功能。

选择Vue模板的一些注意事项包括：

• Webpack
• PWA
• 具有身份验证的全栈
• 好文档
• GraphQL
• Testing

有很多很棒的Vue.js模板，但是，在本文中，我们将看看包含新项目通常需要的关键功能的5个模板。

1.最适合Webpack

如果你需要一个可靠的Webpack设置，那么Vue CLI 2附带的Webpack模板就是最好的。在GitHub上有近7000颗星，Vue团队成员开发和维护，这个模板是创建高度优化的Webpack驱动的最好选择。

该模板利用了Webpack及其生态系统的许多前沿功能，包括热重载，CSS提取，linting以及单文件组件加载。它还包括针对开发，生产甚至测试而优化的独立配置。

作为Vue CLI 2的一部分，这是我们将要展示的最不具意见的模板之一，因此不包括服务器端渲染等许多理想的附加功能。

如果你发现Webpack模板有点过分，你可以试试它的小兄弟，Webpack Simple模板。

链接：https：
//github.com/vuejs-templates/webpack

注意：即将退出测试版的Vue CLI版本3已经放弃了模板体系结构，转而使用插件，因此该模板在技术上将被弃用，但仍可从Vue CLI 3的旧版设置中获取。了解更多信息文章Vue CLI 3：用于前端开发的游戏改变者。

2.最适合PWA

您是否需要渐进式应用的卓越用户体验？Vue Starter是服务器呈现的PWA的SPA模板。它包括Vuex和Vue Router，配置为开箱即用的服务器端渲染（SSR）。

该项目已经考虑到确保您的部署项目从一开始就具有惊人的用户体验，如多语言支持的国际化和灯塔得分为90+，这要归功于SSR和服务工作者的缓存。

此外，使用vue-meta的文档头标签管理用于SEO，而SSR确保您的页面将被支持JavaScript内容的搜索引擎编入索引。

链接：https：
//github.com/devCrossNet/vue-starter

演示：https：
//vue-starter.herokuapp.com

如果您正在构建PWA，另一个不错的选择是VuePack，当然，还有Vue CLI 2 PWA模板。

3.最适合身份验证

如果您需要用户身份验证，请查看Vue Express Mongo Boilerplate。该项目提供了一个全栈“MEVN”Web应用程序样板，具有开箱即用的身份验证，包括用户注册和Google，Facebook，Twitter和GitHub的社交登录。

此模板遵循安全最佳实践，使用OAuth 2，Helmet（添加安全HTTP标头）和Express Validator进行输入清理。它还为多个远程日志记录服务提供支持。

对于数据库，提供了Mongo和Mongoose。repo还包括Docker配置，因此您可以轻松地启动实例。

链接：https：
//github.com/icebob/vue-express-mongo-boilerplate

演示：http：
//vemapp.moleculer.services/

提示：如果您更喜欢使用Laravel作为经过身份验证的Vue应用程序的后端，请尝试使用包含许多类似功能的Laravel Vue Boilerplate。

4.最适合文档

许多模板失败的原因是缺乏文档。Vue Enterprise Boilerplate不是这样。该项目由Chris Fritz创建和维护，他编写了大部分Vue文档，因此它组织良好并与Vue最佳实践保持一致。

关于这个模板的文档的好处在于它不仅解释了包含的内容，还解释了未包含的内容以及原因。例如，Chris解释了为什么没有TypeScript，Babel polyfill，Pug等，这在其他模板中很常见。

不要让这个应用程序的简洁默认页面欺骗你，它也有很多功能。我最喜欢的一些包括用于测试的模拟API，以及包含生成器，允许您自动添加单元测试来设置组件，视图和布局。

Vue Enterprise Boilerplate还支持Vue CLI 3，因此可以使用其他Vue CLI 3插件轻松扩展项目。

链接：https：
//github.com/chrisvfritz/vue-enterprise-boilerplate

5.最适合GraphQL

GraphQL现在风靡一时，许多开发人员都希望在他们的新Vue项目中使用它。虽然Vue模板不多，但是如果你需要GraphQL，请务必查看Vuexpresso。

该项目使用GraphQL，Apollo和GraphiQL UI，这是一个用于浏览GraphQL的浏览器内部IDE。除此之外，您还可以获得配置良好的Webpack设置，Vuex和Vue路由器。您还可以获得Storybook，它允许交互式开发，测试和共享UI组件。

Vuexpresso唯一的缺点是它仍然相当新，所以一定要有时间彻底测试你用它构建的任何应用程序。

链接：https：
//github.com/Ethaan/vuexpresso

另一个支持GraphQL的样板是Friendly Vue Starter，它还包括通过Critical提取的关键路径CSS。