administrators

Quasar UMD is now officially available through cdnjs.com too! https://cdnjs.com/libraries/quasar-framework.

Many thanks to https://github.com/extend1994 for making this possible.

Enjoy!

Hi,

Please write a jsfiddle with your case, and I’ll update it to make it work. If I forget about this thread, please ping me on Discord. Thanks.

@hawkeye64 Example of package.json > devDependencies for 0.16:

"devDependencies": {
    "babel-eslint": "^8.2.2",
    "eslint": "^4.15.0",
    "eslint-config-standard": "^11.0.0",
    "eslint-friendly-formatter": "^3.0.0",
    "eslint-loader": "^2.0.0",
    "eslint-plugin-import": "^2.7.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",
    "quasar-cli": "^0.16.1"
  },

To be sure you’ve installed everything correctly (my feeling is that you missed something), delete node_modules and yarn.lock/package-json.lock then yarn/npm install again.

The main problem with SW on dev mode is that it breaks HMR (Hot Module Reload) since SW caching would be in effect. If you find a clever way to make both SW and HMR happy, I’d be thrilled to integrate the solution.

@hawkeye64 it needs to be there. It’s added when quasar init-ing.

@steffanhalv

1. Do NOT change the webpack target prop. It is already configured in the right way. If you need to change it you’re doing something wrong. Please also note there’s one webpack config for the renderer process and ANOTHER separate one for the main process. Which one are you trying to change? In 99% of the cases, you don’t need to change it anyway.

2. I see that you are importing the http package, which is a node specific library, which is NOT isomorphic (doesn’t also works being run in a browser). You could use it in the main process though, but not in the renderer.

Like I mentioned in a previous post, node-loader and it’s webpack rule for renderer process (it’s currently specified only for the main process) will be available by default in Quasar CLI v0.16.2.

@jaredthirsk

1. Just a note that you won’t need the addition with Quasar CLI v0.16.2. It will also be a good idea to remove “node-loader” from your package.json, because it’s gonna get embedded into the CLI by default. The node-loader was specified only for the main process, not the renderer – I assume you are importing in the renderer process, right?
2. Since you’ve added the webpack rule, you don’t need to also specify node-loader! as prefix in your import statements.

Hi,

1. Mind that the default export is a function.
2. Are you import Socket from ‘quasar’? That ain’t right.
3. I’d rewrite your plugin:

// import WebSocket from '@uci/websocket-client'
import WebSocket from '../../uci-websocket-client/browser-client'

const ws = new WebSocket(process.env.WSS || 'ws://0.0.0.0:8090')

export ws

// leave the export, even if you don't use it
export default ({ Vue }) => {
  Vue.prototype.$socket = ws
}

Reasons for rewrite: You can then import { ws } from 'plugins/Socket' or use the Vue prototype injection (this.$socket).

Plugins are simple ES6 files. Organize them however you want. Quasar is only interested in the default export only, which should be a function with which you get access to the router, Vue object, store and app (Vue root component of your app). You can re-export stuff (through named export names) that you’ll later need.

I would recommend using sub-domains.

@jeffatef Remember that CLI v0.16 is using Webpack 4, so all your webpack plugins must be webpack 4 – usually all it takes it to upgrade to their latest version.
A common mistake when using a linter is to not update your package.json dev dependencies like babel-eslint.

The correct list of package versions (minimum versions to be correct):

"babel-eslint": "^8.2.2",
"eslint": "^4.15.0",
"eslint-config-standard": "^11.0.0",
"eslint-friendly-formatter": "^3.0.0",
"eslint-loader": "^2.0.0",
"eslint-plugin-import": "^2.7.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",