$red:red;.red{颜色:$red;}项目地址本项目的由来在使用了wepy和mpvue之后，我发现这些开源项目在引入一些便利的同时也引入了一些其他的问题。这些问题有的可以通过丑陋的hack来解决，有的只能期待源码修复，给我们造成了另一种负担。已经因为这些运行时框架最终还是依赖原生能力，所以原生写框架肯定有问题，所以我们想能不能直接用单文件开发的形式写原生小程序呢？这也算是“渐进式”的发展，所以就产生了这个工具，它不做运行时的事情，只做预处理，最简化了问题。如何使用#第一步，安装mp-parsernpminstall-gmp-parser#第二步，参照example文件夹新建目录结构#第三步，在项目目录下运行mp-parser复制代码执行mp-parser----help查看帮助。配置文件默认配置如下，如有需要可通过修改项目下的mpp.config.js覆盖。module.exports={//项目根路径root:process.cwd(),//源码目录src:'src',//解析输出目录dist:'dist',//源码目录入口app文件名app:'app.vue',//需要解析的文件夹needParseDirs:['pages','components'],//需要直接复制的文件夹needCopyDirs:['images'],//对应每个标签块生成的扩展exts:{template:'wxml',style:'wxss',script:'js',config:'json',},};复制代码功能支持原生小程序的单文件开发，带有.vue扩展末尾支持sass/scss编译示例：{window:{navigationBarTitleText:'mp-parser'}}{{message}}$red:red;.red{颜色:$red;}复制代码的特殊注意事项除了希望使用单文件开发方式开发小程序外，其他工具或多或少还有其他功能，比如内置js转码压缩，导入npm包之类的。添加js转码压缩主要是为了使用高级特性，比如async，但是我在issue中看到使用async函数会导致ios崩溃，不知道现在解决了没有；而es6toes5和代码压缩使用development自带的工具。npm包的引入可以说是一个比较有必要的功能，但实际上我们在开发中只使用了一小部分包，有些库使用了小程序没有的环境变量，需要手动确认或修改他们在进口之前；直接拷贝npm包可能会导致dist包过大，影响最终打包体积，使用webpack解析依赖会引入额外的运行时代码；我在初始化项目中引入了mta和promiseshims，可以满足一般的开发需求。如果有特殊需求，以后会考虑更优雅的加入这个功能。其实这个工具并不复杂，主要是为了解决一点不便，让我们用得更舒心。欢迎您尝试或分叉。项目地址在这里。
