babel 问题

babel是负责转换ES 新版本语法到老版本js上的。 比如解构语法 ... 程序有如下报错

1Syntax Error: Unexpected token
2
3   8 |     let data_ = [];
4   9 |     data.forEach(d => {
5> 10 |       let d_ = {...d};
6     |                 ^
7  11 |       //产品名称
8  12 |       if(d_.hasOwnProperty('productNo')){
9  13 |         d_.productName = product.getProductNameByProductNo(d_.productNo);

解决方法

1yarn add -D babel-plugin-syntax-jsx
2yarn add -D babel-plugin-transform-runtime
3yarn add -D babel-plugin-transform-vue-jsx
4yarn add -D babel-preset-env
5yarn add -D babel-preset-stage-2 

前端工程根目录建立.babelrc，写入如下内容

1{
2  "presets": [
3    ["env", {
4      "modules": false,
5      "targets": {
6        "browsers": ["> 1%", "last 2 versions", "not ie <= 8"]
7      }
8    }],
9    "stage-2"
10  ],
11  "plugins": [
12       "transform-runtime",
13       "transform-vue-jsx"
14      ]
15}

postcss的问题

Module build failed: Error: No PostCSS Config found in: E:\CODE\xxxxxx

新建.postcssrc.js文件，写入如下内容

1module.exports = {
2  "plugins": {
3    "postcss-import": {},
4    "postcss-url": {},
5    // to edit target browsers: use "browserslist" field in package.json
6    "autoprefixer": {}
7  }
8}