Upgrading v0.16 to v0.17



  • Anyone seen an error similar to this when upgrading from 0.16 =>0.17 ?
    0_1537390714964_Capture d’écran_2018-09-19_21-50-03.png

    ./src/store/app/mutations.js

    import { _LocalStorage } from '…/…/boot/local-storage’
    import Quasar from 'quasar’
    import { i18n } from ‘…/…/plugins/i18n’

    export const setLanguage = (state, payload) => {
    let setup = _LocalStorage.get(‘setup’)
    setup.language = payload
    state.setup.language = payload
    _LocalStorage.set(‘setup’, setup)
    import(quasar-framework/i18n/${payload}).then(lang => {
    Quasar.i18n.set(lang.default)
    })
    i18n.locale = payload
    }

    export const showTerms = (state, payload) => {
    state.setup.showTerms = payload
    }

    export const setup = (state, payload) => {
    state.setup = payload
    }



  • I just upgraded from 0.16.x to 0.17.x just this week.
    Follow these steps:
    install latest quasar cli
    npm i -g quasar-cli@latest
    In the root folder of your project:

    1) delete node-modules folder
    2) `quasar clean`
    3) npm install
    


  • I deleted a node_module folder

    1. quasar clean
    2. npm cache clean --force
    3. nmp install

    But I have this error :
    0_1537485279646_Capture d’écran_2018-09-21_00-09-20_error.png

    Thank you so much for your fast reply.



  • It might help to add quasar-cli to your devDependencies

      "devDependencies": {
        "babel-eslint": "^9.0.0",
        "eslint": "^5.6.0",
        "eslint-config-standard": "^12.0.0",
        "eslint-friendly-formatter": "^4.0.1",
        "eslint-loader": "^2.1.1",
        "eslint-plugin-import": "^2.14.0",
        "eslint-plugin-node": "^7.0.1",
        "eslint-plugin-promise": "^4.0.1",
        "eslint-plugin-standard": "^4.0.0",
        "eslint-plugin-vue": "^4.7.1",
        "less": "^3.8.1",
        "less-loader": "^4.1.0",
        "quasar-cli": "^0.17.19",
        "strip-ansi": "^3.0.1",
        "style-loader": "^0.23.0"
      },
    


  • Same error :

    Error: babel-plugin-transform-imports: import of entire module quasar not allowed due to preventFullImport setting
    
    "dependencies": {
        "@babel/core": "^7.1.0",
        "@babel/plugin-syntax-dynamic-import": "^7.0.0",
        "@babel/plugin-transform-runtime": "^7.1.0",
        "@babel/preset-env": "^7.1.0",
        "apollo-cache-inmemory": "^1.1.12",
        "apollo-client": "^2.2.8",
        "apollo-link-context": "^1.0.7",
        "apollo-link-error": "^1.0.7",
        "apollo-link-http": "^1.5.3",
        "axios": "^0.18.0",
        "croppie": "^2.6.2",
        "firebase": "^4.12.1",
        "graphql": "^0.13.2",
        "graphql-tag": "^2.8.0",
        "moment": "^2.22.1",
        "moment-timezone": "^0.5.16",
        "vue-apollo": "^3.0.0-beta.5",
        "vue-i18n": "^7.3.3",
        "vuelidate": "^0.6.2"
      },
      "devDependencies": {
        "babel-eslint": "^9.0.0",
        "eslint": "^5.6.0",
        "eslint-config-standard": "^12.0.0",
        "eslint-friendly-formatter": "^4.0.1",
        "eslint-loader": "^2.1.1",
        "eslint-plugin-import": "^2.14.0",
        "eslint-plugin-node": "^7.0.1",
        "eslint-plugin-promise": "^4.0.1",
        "eslint-plugin-standard": "^4.0.0",
        "eslint-plugin-vue": "^4.7.1",
        "less": "^3.8.1",
        "less-loader": "^4.1.0",
        "node-sass": "^4.9.3",
        "quasar-cli": "^0.17.19",
        "sass-loader": "^7.1.0",
        "strip-ansi": "^3.0.1",
        "style-loader": "^0.23.0"
      },
    :(


  • Your babel imports should be in devDependencies not dependencies.



  • Sorry I change it in devDpendencies but same Error.
    when I comment the code below in node_modules/babel-plugin-transform-imports/index.js it works, but it’s not advisable:

       if (opts.preventFullImport) {
                                barf('import of entire module ' + source + ' not allowed due to preventFullImport setting');
                            }
    
    "dependencies": {
        "apollo-cache-inmemory": "^1.1.12",
        "apollo-client": "^2.2.8",
        "apollo-link-context": "^1.0.7",
        "apollo-link-error": "^1.0.7",
        "apollo-link-http": "^1.5.3",
        "axios": "^0.18.0",
        "croppie": "^2.6.2",
        "firebase": "^4.12.1",
        "graphql": "^0.13.2",
        "graphql-tag": "^2.8.0",
        "moment": "^2.22.1",
        "moment-timezone": "^0.5.16",
        "vue-apollo": "^3.0.0-beta.5",
        "vue-i18n": "^7.3.3",
        "vuelidate": "^0.6.2"
      },
      "devDependencies": {
        "@babel/core": "7.0.0-beta.52",
        "@babel/plugin-transform-runtime": "7.0.0-beta.52",
        "@babel/preset-env": "7.0.0-beta.52",
        "@babel/preset-stage-2": "7.0.0-beta.52",
        "@babel/runtime": "7.0.0-beta.52",
        "babel-eslint": "^8.2.5",
        "eslint": "^4.15.0",
        "eslint-config-standard": "^11.0.0",
        "eslint-friendly-formatter": "^4.0.1",
        "eslint-loader": "^2.0.0",
        "eslint-plugin-import": "^2.13.0",
        "eslint-plugin-node": "^6.0.1",
        "eslint-plugin-promise": "^3.7.0",
        "eslint-plugin-standard": "^3.0.1",
        "eslint-plugin-vue": "^4.0.0",
        "less": "^3.8.1",
        "less-loader": "^4.1.0",
        "node-sass": "^4.9.3",
        "quasar-cli": "^0.17.19",
        "sass-loader": "^7.1.0",
        "strip-ansi": "^3.0.1",
        "style-loader": "^0.23.0"


  • Can you post your babel configuration? It could be in your package.json, .babelrc.js, etc.



  • It should look something like this:

    .babelrc.js

    module.exports = {
        presets: ['@babel/env'],
        plugins: [
            ['transform-imports', {
                'my-library': {
                    transform: function(importName, matches) {
                        return `my-library/etc/${importName.toUpperCase()}`;
                    },
                    preventFullImport: true,
                }
            }]
        ]
    };
    

    You can set preventFullImport to false.



  • This could also be set in webpack configuration, via quasar. If so, then:

    Name			Type	Required	Default	Description
    preventFullImport	boolean	no		false	Whether or not to throw when an import is encountered which would cause the entire module to be imported.
    

    Additionally, check that your imports are done properly. The error implies that you are trying to import quasar module, which you don’t need to do. All component imports within the quasdar-framework is controlled by the quasar.conf.js configuration.
    https://www.npmjs.com/package/babel-plugin-transform-imports



  • It’s already done for the file babelrc.js 🙂 but it’s crashed and extended by quasar-cli in the file /home/devlamine/sites/pr/client/node_modules/quasar-cli/lib/webpack/create-chain.js /:

    line 113
    
        .use ( 'Babel-loader')
          .loader ( 'Babel-loader')
            .Options ({
              extends: appPaths.resolve.app ('babelrc'),
              plugins: cfg.framework.all! == true? [
                [
                  'transform-imports', {
                    quasar: {
                      transform: `quasar-framework / dist / babel-transforms / imports. $ {cfg.ctx.themeName} .js`,
                      preventFullImport: true
                    }
                  }
                ]
              ]: []
    

    When I change prevent Full Import: true by false it works !!
    I can do framework.all: true in file quasar.conf.js ? there will be no impact in the other functionality ?



  • Not really, but you risk bringing in redundant/dead code that would otherwise be stripped out by tree shaking technology and bloating your app.