CODEWITHSUNDEEP
vue.jsquasar-frameworkwebpack-bundle
Gustavo Sooeiro
Gustavo Sooeiro

Reputation: 327

Config webpack-bundle-tracker from vue.config.js to quasar.conf.js

I have a Vuejs app running with this configuration:

const BundleTracker = require("webpack-bundle-tracker");

module.exports = {
// on Windows you might want to set publicPath: "http://127.0.0.1:8080/" 
 publicPath: "http://0.0.0.0:8080/", 
 outputDir: './dist/', 

 chainWebpack: config => {

    config
        .plugin('BundleTracker')
        .use(BundleTracker, [{filename: './webpack-stats.json'}])

    config.output
        .filename('bundle.js')

    config.optimization
        .splitChunks(false)

    config.resolve.alias
        .set('__STATIC__', 'static')

    config.devServer
        // the first 3 lines of the following code have been added to the configuration
        .public('http://127.0.0.1:8080')    
        .host('127.0.0.1')    
        .port(8080)
        .hotOnly(true)
        .watchOptions({poll: 1000})
        .https(false)
        .disableHostCheck(true)
        .headers({"Access-Control-Allow-Origin": ["\*"]})

},
};

The file webpack-stats.json is as this:

{"status":"done","publicPath":"http://0.0.0.0:8080/","chunks":{"app":[{"name":"bundle.js","publicPath":"http://0.0.0.0:8080/bundle.js","path":"/home/me/myproject/frontend/dist/bundle.js"}]}}

Any tip about how to translate this for quasar.conf.js?

Upvotes: 1

Views: 1439

Answers (1)

Benj
Benj

Reputation: 25

inside the build key put this line

build: {
  vueRouterMode: 'hash', // available values: 'hash', 'history'
  chainWebpack: config => {
    config
      .output
      .publicPath('http://localhost:8080/')
    config
      .plugin('BundleTracker')
      .use(BundleTracker, [{ filename: './webpack-stats.json' }])

    config.output
      .filename('bundle.js')

    config.optimization
      .splitChunks(false)

    config.resolve.alias
      .set('__STATIC__', 'static')

    config.devServer
      .public('http://127.0.0.1:8080')
      .host('127.0.0.1')
      .port(8080)
      .hotOnly(true)
      .watchOptions({ poll: 1000 })
      .https(false)
      .disableHostCheck(true)
      .headers({ "Access-Control-Allow-Origin": ["\*"] })
  },
}

for the in devServer key add this line

headers: {
    'Access-Control-Allow-Origin':  '*'
}

Upvotes: 1

Related Questions