首頁猿問用vue-cli3搭建了一個(gè)項(xiàng)目，...

用vue-cli3搭建了一個(gè)項(xiàng)目，引入了一個(gè)rem.js文件，但是編譯報(bào)錯(cuò)

Vue.js

四季花海 2019-03-18 21:59:00

我把rem.js放在了assets目錄下，編譯之后報(bào)：Uncaught SyntaxError: Unexpected token <這個(gè)該怎么解決？

查看完整描述

2 回答

慕的地10843

TA貢獻(xiàn)1785條經(jīng)驗(yàn) 獲得超8個(gè)贊

這是有個(gè)地方少了 "<"這個(gè) 箭頭的錯(cuò)誤，你檢查下引入的代碼

反對回復(fù) 2019-03-18

holdtom

TA貢獻(xiàn)1805條經(jīng)驗(yàn) 獲得超10個(gè)贊

rem 都已經(jīng)工程化了。。。建議不要不要這么手動(dòng)寫。
a. 安裝這倆
"amfe-flexible": "^2.2.1"
"postcss-pxtorem": "^4.0.1"
b. postcss.config.js 配置(這是我的例子，使用的是vant。實(shí)際規(guī)則跟你自己使用的UI庫來決定是否轉(zhuǎn)換以及轉(zhuǎn)換基準(zhǔn))

const autoprefixer = require('autoprefixer');const pxtorem = require('postcss-pxtorem');module.exports = ({ file }) => {    let ROOTValue;    if (file && file.dirname && (file.dirname.indexOf('vant') > -1) || file.dirname.indexOf('mpvue-calendar') > -1) {
        ROOTValue = 37.5
    } else {
        ROOTValue = 75
    }    return {
        plugins: [
            autoprefixer(),
            pxtorem({
              rootValue: ROOTValue,
              propList: ['*']
            })
        ]
    }
}

c. main.js
import 'amfe-flexible';
d. 頁面里按照設(shè)計(jì)圖上的多少px就直接寫px，打包后自動(dòng)轉(zhuǎn)成rem