nuxtjs проблема с назначением объекта IE11 compatibility_ - PullRequest
Новая
       131

nuxtjs проблема с назначением объекта IE11 compatibility_

0 голосов
/ 14 января 2019

Я страдаю от совместимости IE. (моя версия vue 3.1.0, nuxt 2.3.4)

Сохраняет ошибку с Object.assign. Вот список того, что я пробовал.

  • babel-preset-vue-app (https://www.npmjs.com/package/babel-preset-vue-app). Слышал, что он не поддерживает vue2.X. ​​Я следовал описанию в этом посте . При сборке возникает ошибка источник.

  • Добавление babel-polyfill в nuxt.config.js. Это не ошибка, но все же я получил ошибку Object.assign на странице.

  • Установить babel/plugin-transform-object-assign. Он также не делает никаких ошибок в процессе сборки, но получил объект Назначить вещь на странице.

Можно ли попробовать опцию совместимости с IE11?

Вот мои текущие .babelrc и nuxt.config.js.

.babelrc 

{
    "presets": [
        [
            "env",
            {
                "modules": false
            }
        ],
        [ "vue-app",
            {
                "useBuiltIns": true,
                "targets": {
                    "ie": 9,
                    "uglify": true
                }
            }
        ]
    ],
    "plugins": [
        "@babel/plugin-transform-object-assign",
        "transform-vue-jsx",
        [
            "module-resolver",
            {
                "root": [
                    "./src"
                ],
                "alias": {
                    "~sbdc": "./src/sbdc"
                }
            }
        ]
    ]
}

опция сборки в nuxt.config.js 

build: {
    babel: {
        presets: [
            ['vue-app', {
                useBuiltIns: true,
                targets: { ie: 9, uglify: true }
            }
            ]
        ]
    },
    optimization: {
        splitChunks: {
            chunks: 'all',                  
            maxInitialRequests: Infinity,       
            minSize: 0,                     
            cacheGroups: {              
              vendor: {
                  test: /[\\/]node_modules[\\/](babel-polyfill|moment|lodash|axios|get-size|jquery|js-cookie|jwt-decode|numeral|vuetify)[\\/]/,
                  name: 'utilityVendor'
                }
            }
        }
    },
    output: {
        publicPath: serviceConfig.pwa_publicPath || false
    },
    extractCSS: true,
    plugins: [
        new webpack.ProvidePlugin( {
            $: 'jquery',
            jQuery: 'jquery',
            'window.jQuery': 'jquery',
        } )
    ]
}

Спасибо, что поделились своими решениями!

======= Отредактировано в 0114 =============

Etra information # 1. Когда я смотрю на ошибку в браузере ie11, он автоматически преобразует код, как показано ниже 

return {layout:"popup",data:[{resultBody:Object.assign(Object.create(null), ... sorry, sensitive data

в то время как оригинальный код ... 

asyncData: async function ({req}) {
    return {
        resultBody: req.body,
    };
},

req.body поддерживается body-parser.

1 Ответ

0 голосов
/ 14 января 2019

После нескольких часов борьбы я решил это не лучшим образом (по-моему).

Я просто добавляю объектно-назначаемое заполнение js в nuxt.js 

module.exports = {

    ...

    head: {
        script: [ { src: '/js/object-assign.js' } ]
    },

    ... 

};

Но я все еще хочу знать, как правильно применять babel-polyfill в проекте nuxt.

...