View more context

 

Firesphere

Prod I believe, but null went to bed (rightfully so, it's getting late)

null

Generating a production build and hitting said issue 🙂

flamerohr

I haven't used vue directly with this, so I'm not sure if vue is responsible for its own evals (I've found this that could help https://stackoverflow.com/a/34621858 ) But webpack tries to polyfill node.js functions, which you could try turning off with node: false at the top-level of your webpack config

Show 1 attachment(s)
Stack Overflow  
Vue.js in Chrome extension

Vue.js in Chrome extension Hi! I'm trying to make a Chrome extension using Vue.js but when I write <input v-model="email" type="email" class="form-control" placeholder="Email"> Chrome remo...

Hide attachment content
null

The crux of the problem is template compilation ... supposedly, there's some way to use vue-loader to compile the template in such a way that avoids the eval. I just can't find any documentation on that 🙂

flamerohr

Oh, nice find... Doesn't sound good, but hope you find a solution

👍 (1)
flamerohr

The link I provided offers a different build of vue which handles the template issue you mentioned

null

I found a solution @flamerohr, some simple changes to the entry point got it compliant with the CSP without unsafe-eval:

  1. const app = new Vue({
  2. el: '#app',
  3. components: {
  4. 'my-component': MyComponent
  5. },
  6. });
  1. const app = new Vue({
  2. el: '#app',
  3. components: {
  4. MyComponent
  5. },
  6. render: (h) => {
  7. return h(MyComponent)
  8. }
  9. });

You also need to change your webpack config from this:

  1. resolve: {
  2. alias: {
  3. 'vue$': 'vue/dist/vue.esm.js'
  4. }
  5. },

to this:

  1. resolve: {
  2. alias: {
  3. 'vue$': 'vue/dist/vue.runtime.js'
  4. }
  5. },
flamerohr

ah, that's quite small for a solution 🙂 that's good