No More Posting New Topics!

If you have a question or an issue, please start a thread in our Github Discussions Forum.
This forum is closed for new threads/ topics.

Navigation

    Quasar Framework

    • Login
    • Search
    • Categories
    • Recent
    • Tags
    • Popular
    • Users
    • Groups
    • Search
    1. Home
    2. philliperosario
    P
    • Profile
    • Following 0
    • Followers 0
    • Topics 3
    • Posts 9
    • Best 0
    • Groups 0

    philliperosario

    @philliperosario

    0
    Reputation
    568
    Profile views
    9
    Posts
    0
    Followers
    0
    Following
    Joined Last Online

    philliperosario Follow

    Latest posts made by philliperosario

    • To set a QList at the bottom of the menu

      How to set a QList at the bottom of the menu, like the image below?

      0_1505651911277_Screenshot_20170917-092355.png

      posted in Help
      P
      philliperosario
    • Get platform inside config/index.js

      How I know if the plataform is cordova inside config/index.js?

      var path = require('path')
      
      module.exports = {
        // Webpack aliases
        aliases: {
          quasar: path.resolve(__dirname, '../node_modules/quasar-framework/'),
          src: path.resolve(__dirname, '../src'),
          assets: path.resolve(__dirname, '../src/assets'),
          '@': path.resolve(__dirname, '../src/components'),
          variables: path.resolve(__dirname, '../src/themes/quasar.variables.styl'),
          'vuex-store': path.resolve(__dirname, '../src/store'),
          package: path.resolve(__dirname, '../package.json')
        },
        progressFormat: ' [:bar] ' + ':percent'.bold + ' (:msg)',
        defaultTheme: 'mat',
      
        build: {
          env: require('./prod.env'),
          publicPath: [Platform.is.cordova] ? '' : '/', // ON HERE! I NEED TO KNOW IF THE PLATFORM IS CORDOVA
          productionSourceMap: false,
          purifyCSS: true
        },
        dev: {
          env: require('./dev.env'),
          cssSourceMap: true,
          openBrowser: false,
          publicPath: '/',
          port: 8080,
          proxyTable: {}
        }
      }
      
      
      posted in Help
      P
      philliperosario
    • RE: UglifyJs Unexpected token punc «(», expected punc «:»

      @danielo515

      .babelrc

      {
        "presets": [["es2015", {"modules": false}], "stage-2"],
        "plugins": ["transform-runtime"],
        "comments": false
      }
      

      build/webpack.base.conf.js

      var
        path = require('path'),
        webpack = require('webpack'),
        config = require('../config'),
        cssUtils = require('./css-utils'),
        env = require('./env-utils'),
        merge = require('webpack-merge'),
        projectRoot = path.resolve(__dirname, '../'),
        ProgressBarPlugin = require('progress-bar-webpack-plugin'),
        useCssSourceMap =
          (env.dev && config.dev.cssSourceMap) ||
          (env.prod && config.build.productionSourceMap)
      
      function resolve (dir) {
        return path.join(__dirname, '..', dir)
      }
      
      module.exports = {
        entry: {
          app: './src/main.js'
        },
        output: {
          path: path.resolve(__dirname, '../dist'),
          publicPath: config[env.prod ? 'build' : 'dev'].publicPath,
          filename: 'js/[name].js',
          chunkFilename: 'js/[id].[chunkhash].js'
        },
        resolve: {
          extensions: ['.js', '.vue', '.json'],
          modules: [
            resolve('src'),
            resolve('node_modules')
          ],
          alias: config.aliases
        },
        module: {
          rules: [
            { // eslint
              enforce: 'pre',
              test: /\.(vue|js)$/,
              loader: 'eslint-loader',
              include: projectRoot,
              exclude: /node_modules/,
              options: {
                formatter: require('eslint-friendly-formatter')
              }
            },
            {
              test: /\.js$/,
              loader: 'babel-loader',
              include: projectRoot,
              exclude: /node_modules/
            },
            {
              test: /\.vue$/,
              loader: 'vue-loader',
              options: {
                postcss: cssUtils.postcss,
                loaders: merge({js: 'babel-loader'}, cssUtils.styleLoaders({
                  sourceMap: useCssSourceMap,
                  extract: env.prod
                }))
              }
            },
            {
              test: /\.json$/,
              loader: 'json-loader'
            },
            {
              test: /\.(png|jpe?g|gif|svg)(\?.*)?$/,
              loader: 'url-loader',
              options: {
                limit: 10000,
                name: 'img/[name].[hash:7].[ext]'
              }
            },
            {
              test: /\.(woff2?|eot|ttf|otf)(\?.*)?$/,
              loader: 'url-loader',
              options: {
                limit: 10000,
                name: 'fonts/[name].[hash:7].[ext]'
              }
            }
          ]
        },
        plugins: [
          new webpack.DefinePlugin({
            'process.env': config[env.prod ? 'build' : 'dev'].env,
            'DEV': env.dev,
            'PROD': env.prod,
            '__THEME': '"' + env.platform.theme + '"'
          }),
          new webpack.LoaderOptionsPlugin({
            minimize: env.prod,
            options: {
              context: path.resolve(__dirname, '../src'),
              postcss: cssUtils.postcss
            }
          }),
          new ProgressBarPlugin({
            format: config.progressFormat
          })
        ],
        performance: {
          hints: false
        }
      }
      

      config/index.js

      var path = require('path')
      
      module.exports = {
        // Webpack aliases
        aliases: {
          quasar: path.resolve(__dirname, '../node_modules/quasar-framework/'),
          src: path.resolve(__dirname, '../src'),
          assets: path.resolve(__dirname, '../src/assets'),
          '@': path.resolve(__dirname, '../src/components'),
          variables: path.resolve(__dirname, '../src/themes/quasar.variables.styl'),
          'vuex-store': path.resolve(__dirname, '../src/store'),
          package: path.resolve(__dirname, '../package.json')
        },
      
        // Progress Bar Webpack plugin format
        // https://github.com/clessg/progress-bar-webpack-plugin#options
        progressFormat: ' [:bar] ' + ':percent'.bold + ' (:msg)',
      
        // Default theme to build with ('ios' or 'mat')
        defaultTheme: 'mat',
      
        build: {
          env: require('./prod.env'),
          publicPath: '/',
          productionSourceMap: false,
      
          // Remove unused CSS
          // Disable it if it has side-effects for your specific app
          purifyCSS: true
        },
        dev: {
          env: require('./dev.env'),
          cssSourceMap: true,
          // auto open browser or not
          openBrowser: false,
          publicPath: '/',
          port: 8080,
      
          // If for example you are using Quasar Play
          // to generate a QR code then on each dev (re)compilation
          // you need to avoid clearing out the console, so set this
          // to "false", otherwise you can set it to "true" to always
          // have only the messages regarding your last (re)compilation.
          clearConsoleOnRebuild: false,
      
          // Proxy your API if using any.
          // Also see /build/script.dev.js and search for "proxy api requests"
          // https://github.com/chimurai/http-proxy-middleware
          proxyTable: {}
        }
      }
      
      /*
       * proxyTable example:
       *
         proxyTable: {
            // proxy all requests starting with /api
            '/api': {
              target: 'https://some.address.com/api',
              changeOrigin: true,
              pathRewrite: {
                '^/api': ''
              }
            }
          }
       */
      
      posted in Help
      P
      philliperosario
    • RE: UglifyJs Unexpected token punc «(», expected punc «:»

      @danielo515 do you have any idea how I can solve this? Could you tell me another compressor that is widely used by the community? Thanks.

      posted in Help
      P
      philliperosario
    • RE: history mode for web and not for cordova

      @smakinson So far, no error!

      posted in Framework
      P
      philliperosario
    • UglifyJs Unexpected token punc «(», expected punc «:»

      Using Lazy Loading:

      // sections from /src/router.js
      function load (component) {
        // '@' is aliased to src/components
        return () => System.import(`@/${component}.vue`)
      }
      

      And:

      quasar build
      

      Trigger the following error:

      ERROR in js/0.aab963007f1783dc01dc.js from UglifyJs
      Unexpected token punc «(», expected punc «:» [js/0.aab963007f1783dc01dc.js:36,13]
      
      ERROR in js/1.7861e04c92edd3414bc7.js from UglifyJs
      Unexpected token punc «(», expected punc «:» [js/1.7861e04c92edd3414bc7.js:36,13]
      npm ERR! code ELIFECYCLE
      npm ERR! errno 1
      npm ERR! quasar-app@0.0.1 build: `node build/script.build.js`
      npm ERR! Exit status 1
      npm ERR!
      npm ERR! Failed at the quasar-app@0.0.1 build script.
      npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
      
      npm ERR! A complete log of this run can be found in:
      npm ERR!     C:\Users\phill\AppData\Roaming\npm-cache\_logs\2017-09-15T22_41_13_964Z-debug.log
      

      However, if I remove the ${…} ,

      // sections from /src/router.js
      function load (component) {
        // '@' is aliased to src/components
        return () => System.import(`@/foo.vue`)
      }
      

      no error is displayed!

      $ npm list --depth=0
      quasar-app@0.0.1 C:\Users\phill\Desktop\plenario\quasar
      +-- autoprefixer@6.7.7
      +-- axios@0.16.2
      +-- babel-core@6.26.0
      +-- babel-eslint@7.2.3
      +-- babel-loader@7.1.2
      +-- babel-plugin-transform-es2015-shorthand-properties@6.24.1
      +-- babel-plugin-transform-runtime@6.23.0
      +-- babel-preset-es2015@6.24.1
      +-- babel-preset-stage-2@6.24.1
      +-- babel-runtime@6.26.0
      +-- UNMET PEER DEPENDENCY bulma@>=0.2
      +-- colors@1.1.2
      +-- connect-history-api-fallback@1.3.0
      +-- css-loader@0.28.7
      +-- es6-promise@4.1.1
      +-- eslint@4.6.1
      +-- eslint-config-standard@10.2.1
      +-- eslint-friendly-formatter@3.0.0
      +-- eslint-loader@1.9.0
      +-- eslint-plugin-html@3.2.1
      +-- eslint-plugin-import@2.7.0
      +-- eslint-plugin-node@5.1.1
      +-- eslint-plugin-promise@3.5.0
      +-- eslint-plugin-standard@3.0.1
      +-- eventsource-polyfill@0.9.6
      +-- express@4.15.4
      +-- extract-text-webpack-plugin@3.0.0
      +-- file-loader@0.11.2
      +-- friendly-errors-webpack-plugin@1.6.1
      +-- glob@7.1.2
      +-- html-webpack-plugin@2.30.1
      +-- http-proxy-middleware@0.17.4
      +-- json-loader@0.5.7
      +-- laravel-echo@1.3.2
      +-- less@2.7.2
      +-- less-loader@4.0.5
      +-- moment@2.18.1
      +-- opn@5.1.0
      +-- optimize-css-assets-webpack-plugin@3.2.0
      +-- postcss-loader@1.3.3
      +-- progress-bar-webpack-plugin@1.10.0
      +-- purify-css@1.2.6
      +-- pusher-js@4.1.0
      +-- quasar-extras@0.0.8
      +-- quasar-framework@0.14.3
      +-- shelljs@0.7.8
      +-- stylus@0.54.5
      +-- stylus-loader@3.0.1
      +-- url-loader@0.5.9
      +-- vue@2.3.4
      +-- vue-bulma-datepicker@1.3.6
      +-- vue-loader@12.2.2
      +-- vue-router@2.7.0
      +-- vue-select@2.2.0
      +-- vue-style-loader@3.0.3
      +-- vue-template-compiler@2.3.4
      +-- vuex@2.4.0
      +-- vuex-persistedstate@2.0.0
      +-- vuex-router-sync@4.3.1
      +-- webpack@3.6.0
      +-- webpack-dev-middleware@1.12.0
      +-- webpack-hot-middleware@2.19.1
      `-- webpack-merge@4.1.0
      
      npm ERR! peer dep missing: bulma@>=0.2, required by vue-bulma-datepicker@1.3.6
      
      $ npm list --depth=0 -g
      C:\Users\phill\AppData\Roaming\npm
      +-- bower@1.8.0
      +-- cordova@7.0.1
      +-- electron@1.4.15
      +-- grunt-cli@1.2.0
      +-- gulp@3.9.1
      +-- UNMET PEER DEPENDENCY less@^2.3.1
      +-- less-loader@4.0.5
      +-- npm@5.3.0
      +-- quasar-cli@0.6.4
      +-- vue-cli@2.8.1
      +-- vue-router@2.2.1
      +-- vuex@2.1.2
      `-- UNMET PEER DEPENDENCY webpack@^2.0.0 || ^3.0.0
      
      npm ERR! peer dep missing: less@^2.3.1, required by less-loader@4.0.5
      npm ERR! peer dep missing: webpack@^2.0.0 || ^3.0.0, required by less-loader@4.0.5
      npm ERR! invalid: node-gyp@3.4.0 C:\Users\phill\AppData\Roaming\npm\node_modules\cordova\node_modules\npm\node_modules\node-gyp
      npm ERR! missing: path-array@^1.0.0, required by node-gyp@3.4.0
      
      
      posted in Help
      P
      philliperosario
    • RE: history mode for web and not for cordova
      // VueRouter "history" mode DOESN'T works for Cordova builds, it is only to be used only for websites.
      // If you decide to go with "history" mode, please also open /config/index.js and set "build.publicPath" to something other than an empty string. (Example: '/' instead of current '')
      // If switching back to default "hash" mode, don\'t forget to set the build publicPath back to '' so Cordova builds work again.
      

      So, is need change the /config/index.js file too. How get Platform.is.cordova value inside this file?

      posted in Framework
      P
      philliperosario