Chrome扩展中的Vue.js [英] Vue.js in Chrome extension

查看:356
本文介绍了Chrome扩展中的Vue.js的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

Chrome扩展中的Vue.js



嗨!我正在尝试使用Vue.js制作Chrome扩展程序,但是当我写入时,

 < input v-model =email type =emailclass =form-controlplaceholder =Email> 

Chrome会移除代码的v模型部分并使其成为

 < input type =emailclass =form-controlplaceholder =Email> 

有没有办法阻止这种情况发生?

解决方案

你有csp版本(Vue.js v1)吗?

CSP版本

某些环境(例如Google Chrome应用)执行内容安全策略(CSP),并且不允许使用新的Function()来评估表达式。在这些情况下,您可以使用CSP兼容版本。



(Vue.js v1) http://v1.vuejs.org/guide/installation.html#CSP-compliant-build

  npm install vue @ csp --save 

dependencies:{
vue:1.0.26- csp

新版本(Vue.js v2) https://vuejs.org/v2/guide/installation.html#CSP-environments p>

某些环境(如Google Chrome应用)执行内容安全策略(CSP),该策略禁止使用新的函数()来评估表达式。独立版本依赖于此功能来编译模板,因此在这些环境中无法使用。



然而有一个解决方案。在带有Webpack + vue-loader或Browserify + vueify的构建系统中使用Vue时,您的模板将被预编译为在CSP环境中完美运行的渲染函数。


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 removes the v-model-part of the code and makes it

<input type="email" class="form-control" placeholder="Email">

Is there a way to prevent this?

解决方案

Have you csp version (Vue.js v1)

CSP-compliant build

Some environments, such as Google Chrome Apps, enforces Content Security Policy (CSP) and does not allow the use of new Function() for evaluating expressions. In these cases you can use the CSP-compliant build instead.

(Vue.js v1) http://v1.vuejs.org/guide/installation.html#CSP-compliant-build

npm install vue@csp --save

"dependencies": {
  "vue": "1.0.26-csp"
}

New version (Vue.js v2) https://vuejs.org/v2/guide/installation.html#CSP-environments

Some environments, such as Google Chrome Apps, enforce Content Security Policy (CSP), which prohibits the use of new Function() for evaluating expressions. The standalone build depends on this feature to compile templates, so is unusable in these environments.

There is a solution however. When using Vue in a build system with Webpack + vue-loader or Browserify + vueify, your templates will be precompiled into render functions which work perfectly in CSP environments.

这篇关于Chrome扩展中的Vue.js的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆