1 Востаннє редагувалося BigMonk (05.05.2019 19:55:19)

Тема: Налаштування Babel в symfony

Привіт всім.
Не можу налаштувати конвертацію js коду з ES6 в ES5.
Створив файл .babelrc в корені проекту
Добавляв в нього:

{
    presets: [
        ['env', {
            modules: false,
            targets: {
                browsers: '> 1%',
                uglify: true
            },
            useBuiltIns: true
        }]
    ]
}

це описано в цій документації https://symfony.com.ua/doc/current/fron … babel.html
але нічого не конвертується. Файли які генеруються всеодно містять let а не var.
Тобто конвертація на скільки я розумію не працює.
Також пробував створювати файлик .babelrc з таким вмістом:

{
  "presets": [
    [
      "@babel/preset-env",
      {
        "targets": {
          "ie": "10"
        },
        "useBuiltIns": false
      }
    ]
  ]
}

теж саме, помилок ніяких не видає а генерація файлів через yarn проходить успішно
webpack.config.js:

const Encore = require('@symfony/webpack-encore');
const CopyWebpackPlugin = require('copy-webpack-plugin');
const ConcatPlugin = require("webpack-concat-plugin");

Encore
    .setOutputPath('public/build/')
    .setPublicPath('/build')

    .addStyleEntry('ie9', ['./assets/less/vr.ie9.less'])
    .addStyleEntry('style_no_reset', ['./assets/scss/style_no_reset.scss'])
    .addStyleEntry('style', ['./assets/scss/style.scss'])
    .addStyleEntry('general', ['./assets/css/general.css'])
    .addStyleEntry('vr.slides', ['./assets/less/vr.slides.less'])
    .addStyleEntry('style_invoice', ['./assets/scss/style_invoice.scss'])
    .addStyleEntry('style-booking', ['./assets/scss/style-booking.scss'])
    .addStyleEntry('style-hp', ['./assets/scss/style-hp.scss'])
    .addStyleEntry('select2-core', ['./assets/js/components/select2/src/scss/core.scss'])

    .addStyleEntry('base-css', [
        './assets/js/chosen/chosen.css',
        './assets/css/simplrform.css',
        './assets/css/magnific-popup.css',
        './assets/js/bootstrap-datepicker/css/bootstrap-datepicker3.standalone.min.css',
        './assets/css/daterangepicker.css',
        './assets/css/animate.min.css',
        './assets/less/vr.messaging.less',
        './assets/less/vr.attachments.less',
        './assets/less/vr.myprofile.less',
        './assets/css/mobile-styles.css',
        './assets/css/fa/css/font-awesome.css'
    ])

    .addEntry('new-relic-monitoring', './assets/js/new-relic-monitoring.js')

    .enableSingleRuntimeChunk()
    .cleanupOutputBeforeBuild()
    .enableBuildNotifications()
    .enableSourceMaps(!Encore.isProduction())
    .enableVersioning(Encore.isProduction())
    .enableSassLoader()
    .enableLessLoader()
    .autoProvidejQuery()
    .addPlugin(new CopyWebpackPlugin(
        [
            {from: './assets/images', to: 'static'},
            {from: './assets/js', to: 'js'},
            {from: './assets/css', to: 'css'},
            {from: './assets/media', to: 'media'},
            {from: './assets/manifest', to: 'manifest'}
        ]
    ))
    .addPlugin(new ConcatPlugin(
        {
            uglify:        Encore.isProduction(),
            sourceMap:     false,
            fileName:      "vr-base.js",
            filesToConcat: [
                './assets/js/vr/vr.js',
                './assets/js/vr/vr.user-preferences.js',
                './assets/js/vr/vr.account.js',
                './assets/js/vr/vr.cta.js',
                './assets/js/vr/vr.confirm-dialog.js',
                './assets/js/vr/vr.tutorials.js',
                './assets/js/vr/vr.forms.js',
                './assets/js/vr/vr.stepper.js',
                './assets/js/vr/vr.my-venues.js',
                './assets/js/vr/vr.favorites.js',
                './assets/js/vr/vr.venue-list.js',
                './assets/js/vr/vr.top-menu.js',
                './assets/js/vr/vr.venue-search.js',
                './assets/js/vr/vr.roundups.js',
                './assets/js/vr/vr.booking.js',
                './assets/js/vr/vr.messaging.js',
                './assets/js/vr/vr.login.js',
                './assets/js/vr/vr.tracking.js',
                './assets/js/vr/vr.hpsdk.js',
                './assets/js/vr/vr.stories.js',
                './assets/js/vr/vr.user-gatherings.js',
                './assets/js/vr/vr.header.js',
                './assets/js/vr/vr.destinations.js',
                './assets/js/vr/vr.doubleclick.js',
                './assets/js/vr/vr.modal.js',
                './assets/js/vr/vr.room-blocks.js',
                './assets/js/vr/vr.coco-form.js',
            ]
        })
    )
    .addPlugin(new ConcatPlugin(
        {
            uglify:        Encore.isProduction(),
            fileName:      'app-base.js',
            filesToConcat: [
                './assets/js/jquery.history.js',
                './assets/js/trash.js',
                './assets/js/jquery.magnific-popup.min.js',
                './assets/js/pinterest.js',
                './assets/js/uniform/jquery.uniform.min.js',
                './assets/js/chosen/chosen.jquery.min.js',
                './assets/js/moment.min.js',
                './assets/js/hoverIntent.js',
                './assets/js/flexslider.min.js',
                './assets/js/cookie.js',
                './assets/js/scripts.js',
                './assets/js/jquery.inview.js',
                './assets/js/custom.js',
                './assets/js/mobile.js',
                './assets/js/global-ajax.js',
                './assets/js/jquery.imageloader.js',
                './assets/js/jquery.validate.min.js',
                './assets/js/bootstrap-datepicker/js/bootstrap-datepicker.min.js',
                './assets/js/daterangepicker.js',
                './assets/js/jquery.touch.js',
                './assets/js/range-multiple.min.js',
                './assets/js/components/slick-carousel/slick/slick.min.js',
                './assets/js/components/select2/dist/js/select2.min.js',
                './assets/js/components/fancybox/lib/jquery.mousewheel-3.0.6.pack.js',
                './assets/js/components/fancybox/source/jquery.fancybox.pack.js',
                './assets/js/components/iCheck/icheck.min.js',
                './assets/js/libs/jquery.mask.min.js',
                './assets/js/components/tooltipster/dist/js/tooltipster.bundle.min.js',
                './assets/js/vr-scripts.js',
                './assets/js/jquery.sticky.js'
            ]
        }
    ))
;

module.exports = Encore.getWebpackConfig();

package.json:

{
    "devDependencies": {
        "bootstrap-datepicker": "^1.5.0",
        "webpack-notifier": "^1.6.0"
    },
    "license": "UNLICENSED",
    "private": true,
    "scripts": {
        "dev-server": "encore dev-server",
        "dev": "encore dev --progress",
        "watch": "encore dev --watch",
        "build": "encore production --progress"
    },
    "dependencies": {
        "@symfony/webpack-encore": "^0.22.0",
        "copy-webpack-plugin": "^4.6.0",
        "core-js": "3",
        "jquery": "1.11.3",
        "jquery-migrate": "1.2.1",
        "less": "^3.9.0",
        "less-loader": "^4.1.0",
        "node-sass": "^4.11.0",
        "package": "^1.0.1",
        "sass-loader": "^7.0.1",
        "url-loader": "^1.1.2",
        "webpack-concat-plugin": "^3.0.0"
    }
}

Якщо в файл .babelrc написати щось некоректне, то компіляція не завершується, вибиває помилку компіляції, це значить що цей файл задіюється

2

Re: Налаштування Babel в symfony

BigMonk написав:

це описано в цій документації https://symfony.com.ua/doc/current/fron … babel.html

Офіційна документація розміщена в symfony.com, а не в symfony.com.ua .

Подякували: ostap34PHP1

3 Востаннє редагувалося BigMonk (06.05.2019 13:14:20)

Re: Налаштування Babel в symfony

leofun01 написав:
BigMonk написав:

це описано в цій документації https://symfony.com.ua/doc/current/fron … babel.html

Офіційна документація розміщена в symfony.com, а не в symfony.com.ua .

зробив точно так як у вищезгаданій офіційній документації.
Компіляцію проходить, але не конвертує  синтаксис (: