https://github.com/wangweianger/vue2.5-webpack3.8-spa-base-cms
vue2.5版全家桶+webpack3.8 cms项目基础模板框架
https://github.com/wangweianger/vue2.5-webpack3.8-spa-base-cms
sass vue-router vue2 vuex webpack3
Last synced: 9 months ago
JSON representation
vue2.5版全家桶+webpack3.8 cms项目基础模板框架
- Host: GitHub
- URL: https://github.com/wangweianger/vue2.5-webpack3.8-spa-base-cms
- Owner: wangweianger
- Created: 2017-10-20T02:41:55.000Z (almost 9 years ago)
- Default Branch: master
- Last Pushed: 2018-06-12T07:15:07.000Z (about 8 years ago)
- Last Synced: 2025-02-01T08:06:18.593Z (over 1 year ago)
- Topics: sass, vue-router, vue2, vuex, webpack3
- Language: JavaScript
- Homepage:
- Size: 1 MB
- Stars: 30
- Watchers: 5
- Forks: 11
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# vue组件化开发-示例 vue2.5+webpack3.8
> * 使用知识点:
> * vue.js 轻量级mvvm框架
> * webpack 前端自动话打包工具
> * vue-router vue路由
> * vue-loader vue组件化开发插件
> * vuex 前端状态管理 类式于flux 和 radux
> * babel es6转译工具,用最前言的javascript做前端开发
## 优化说明
> * DllPlugin和DllReferencePlugin 项目中不更改js不需要重复构建 例如:vue,vuex,vue-router 等等
参考配置: webpack.dll.config.js
> * happypack 优化 针对于.vue、.js、.scss 文件进行多线程编译
> * webpack-parallel-uglify-plugin 插件替换 webpack 自带的UglifyJS 插件 支持打包es6语法
> * Webpack 3 的新功能:Scope Hoisting 新增配置插件 new webpack.optimize.ModuleConcatenationPlugin()
### 优化之后构建速度明显提高
### webpack优化构建说明:http://blog.seosiwei.com/detail/9
## 项目步骤
1.安装node.js
2.安装项目依赖包
```
npm install
```
3.运行开发环境
```
npm run dev
```
```
浏览器中访问:localhost:8000
```
4.打包生产文件 打生产报需要构建一次 dll 命令:即经常不会改动的文件
```
npm run build:dll //此命令一般只运行一次 若后期依赖项目有改动才运行
npm run build //每次生产包运行
```
##大致说明
```
webpack : 前端模块化打包工具
vue.js : vue.js 清量级的mvvm的框架
babel : 项目使用babel编译 可用最新的es6编写我们的javascript (当然用es5写也是一样的)
vue-loader :模块化的开发vue插件
vue-router :vue的路由插件
vuex : 一个专门为 Vue.js 应用设计的状态管理架构
```
### DEMO图片
