vue boilerplate template下载 - vue boilerplate template源码下载

vue boilerplate template

其他类别

vue-boilerplate-template V2.0.0

下载

Vue 样板模板

?(vue webpack vuex vue-router vue-i18n element-ui) 开箱即用

？用于创建 Medium Plus Vue.js(2.*) 项目的漂亮样板模板

中文维基百科

目标与理念

对于如何构建中型（+） VUE项目，根据以往的经验提供一些参考。基于vue-cli3最新Vue Boilerplate已经开源：awesome-vue-cli3-example，如果你关注一下，相信是非常值得的？。

先决条件

Node.js（>=4.x、8.x 首选）、Npm 版本 4+（首选 Yarn）和 Git。

演示

在线演示页面

优势

基于vue-cli构建，对于如何方便vue的使用进行更多的优化。
已经包含了很多常用的库，比如vue-i18n , axios , lodash ...
附有一些关于Vue经验文章，如：如何写一手漂亮的Vue。并且还在更新中。
对如何使用WebPack构建应用程序进行更多优化。
- Webpack 预留优化之体积篇
- Webpack 资源优化之速度篇
- 使用 webpack 优化您的库
- Webpack 不错的教程

用法

 git clone https://github.com/nicejade/vue-boilerplate-template (your-project-name)
cd your-project-name
npm install (npm i / yarn)
npm start / npm run dev / yarn run dev

转到 http://localhost:8080/。如果端口 8080 已在您的计算机上使用，程序将为您指定可用端口（增量），例如8081 / 8082 ... 。当然，您可以使用以下命令临时替换端口：

 PORT=8888 npm run dev

补充补充：您需要确保PORT是您的机器上可以执行的命令。

更多命令

 npm run build

相当于执行node build.js ，启动一个构建项目。

 npm run build:dll

等效执行webpack --config build/webpack.dll.conf.js ，更多信息参见 webpack.DllPlugin 。

 npm run jarvis / yarn run jarvis

运行 webpack-jarvis(一个非常智能的基于浏览器的 Webpack 仪表板)，在浏览器中打开： localhost:1337 ，你就拥有了。

npm run pretest

使用nodejs搭建本地服务器： http://localhost:3000/ ，对打包后的代码做简单的预测试。

 npm run analyz

Webpack 插件和 CLI 实用程序将捆绑包内容表示为方便的交互式可缩放树形图。它会自动打开这个地址：http://localhost:8888/ 。

依赖插件列表

vue2
vue-路由器
视图
vue-i18n
轴
引导程序
元素UI
洛达什
片刻戴杰斯
js-cookie
……

操作请求

你的后端可以返回以下格式的数据，那就更好了。

 {
  success: true,
  message: 'err message content',
  value: [
    // Useful data
  ]
}

在前端，你可以这样处理请求：

 let params = {
  // Interface required parameters
}
this.isLoading = true
this.$apis.moduleName.getProfile(params).then(result => {
  // Handle the correct data you received
}).catch(error => {
  this.$message.error(`Error: ${error}`)
}).fin(() => {
  this.isLoading = false
})

这么贴心，Template已经帮助统一处理请求了，所以你可以这么好用，当然你可以在helper/ajax.js文件中根据需要更改你自己的。