1.安装。
全局安装vue-cli,初始化一个webpack项目,安装依赖并启动
npm install -g vue-cli
vue init webpack demo
cd demo
npm init
npm run dev
2.dev 、start、build所代表的的具体命令在 package.json中。
"dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js",
"start": "npm run dev",
"build": "node build/build.js"
3.build是打包的配置文件夹(其中的build.js是来打生产包的),config是webpack的配置文件夹。spa需要关注webpack.base.conf.js(是一个打包核心配置)和config/index.js(环境的配置)。assetsPublicPath作为静态资源的前缀,可以写上CDN的地址。
4.在Vue2.x模拟mock数据时,没有dev-server.js,要在webpack.dev.conf.js文件里通过
...
const portfinder = require('portfinder')
//加载express
var express = require('express');
var app = express();
//加载本地json
var goodsData = require('../mock/goods.json');
var goods = goodsData.result;
const HOST = process.env.HOST
...
watchOptions: {
poll: config.dev.poll,
}
//设置路由start
,
before(app){
app.get('/goods/',(req,res)=>{
res.json({
code:0,
data:goods
})
})
}
//设置路由end
},
plugins:
...
来引用。
5.v-for循环的img中的src最好用v-bind来绑定,否则因为dom渲染速度快导致来不及加载图片。图片懒加载用vue-lazyload。
0条评论