# 全局安装 vue-cli
$ npm install --global vue-cli
# 创建一个基于 mpvue-quickstart 模板的新项目
$ vue init mpvue/mpvue-quickstart my-project
# 安装依赖
$ cd my-project
$ npm install
配置pug // build/webpack.base.config
npminstallpug pug-loader pug-filters --save
rules {
test:/\.pug$/,
loader:'vue-html!pug-html'
},
配置stylus // build/webpack.base.config
npminstallstyle-loader stylus stylus-loader --save
npminstallextract-text-webpack-plugin --save
rules {
test:/\.styl/,
loader: ExtractTextPlugin.extract("css-loader!stylus-loader")
}
plugins
newExtractTextPlugin('css/style.css'),
vscode 配置快速模板
1、文件 ==> 首选项 ==> 用户代码片段 ==> 输入 vue然后回车
{
"Print to console": {
"prefix":"vv",//自己随便定义快捷键
"body": [
"<template lang=\"pug\">",
" div.wrapper",
"</template>\n",
"<script>",
"import Vue from 'vue'",
"export default Vue.extend({",
" components: {\n",
" },",
" data () {",
" return {\n",
" }",
" }",
"})",
"</script>\n",
"<style scoped lang=\"stylus\">",
"</style>",
"",
],
"description":"Log output to console"
}
}
下载 https://github.com/TalkingData/iview-weapp 解压 dist目录导入 页面内使用
npm run dev
ok!
