脚手架搭建微信小程序问题汇总

学习教程为前端开发利器vue，微信小程序快速开发实战，黑马程序员前端web教程

一、启动项目时报错

Syntax Error: Error: PostCSS plugin autoprefixer requires PostCSS 8.

Migration guide for end-users:

https://github.com/postcss/postcss/wiki/PostCSS-8-for-end-users

（也可以点击链接查看官方解决问题的方法）

解决方法如下👇

我们的postcss版本可能不符合当前的要求所以需要进行升级或安装

npm install -s postcss-cli@8.0.0
npm install postcss

二、安装noed-sass 和sass-loader后无法启动小程序项目

npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! pic-search-project@0.1.0 dev:mp-weixin: `cross-env NODE_ENV=development UNI_PLATFORM=mp-weixin vue-cli-service uni-build --watch`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the pic-search-project@0.1.0 dev:mp-weixin script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:

大概率为node版本和noed-sass 和sass-loader版本不兼容

首先node -v检查node版本，再与noed-sass 和sass-loader对照，

我的node版本为v14.16.0

重新安装如下

 npm install node-sass@4.14.1 sass-loader@7.3.1

目前可行的对应版本

node：v14.16.0

node-sass：v4.14.1

sass-loader：v7.3.1

三、微信开发者工具中提示 [ app.json 文件内容错误] app.json: app.json 未找到(env: Windows,mp,1.05.2107090; lib: 2.20.1)

在project.config.json中添加一句注意自己的文件目录

"miniprogramRoot": "dist/dev/mp-weixin/",