import { register } from 'register-service-worker'
import pwa from '@vue/cli-plugin-pwa'
if (process.env.NODE_ENV === 'development') {
// if (process.env.NODE_ENV === 'production') {
console.log(pwa)
register(`${process.env.BASE_URL}service-worker.js`, {
ready () {
console.log(
'App is being served from cache by a service worker.\n'
)
},
cached () {
console.log('Content has been cached for offline use.')
},
updated () {
console.log('New content is available; please refresh.')
},
offline () {
console.log('No internet connection found. App is running in
offline mode.')
},
error (error) {
console.error('Error during …Run Code Online (Sandbox Code Playgroud) 我需要一些帮助,或者至少需要指出正确的方向。我正在尝试使用 Vue CLI 3 部署 vuejs 应用程序。当我运行 build 命令时,文件被内置到 dist 文件夹中,这工作正常。dist 中还有一个 js 和 css 文件夹,其中包含相应的文件。在我的 index.html 中,路径被创建为 /css/app.css 或 /js/app.js。我希望文件与 index.html 和路径一起放置在 dist 文件夹中,以简单地读取 app.css 或 app.js。我的目标是删除 /css/.
我假设这是通过配置 webpack 在 vue.config.js 中完成的。我似乎无法弄清楚这一点。我了解 baseURL 设置,但我可以弄清楚这部分......任何帮助将不胜感激。
谢谢
我的组件中有一个名为 的对象数组config和一个currentIdx属性。然后我发现自己需要这样做:
computed: {
textStyle: function() {
return this.config[this.currentIdx].textStyle;
},
text: function() {
return this.config[this.currentIdx].text;
},
key: function() {
return this.config[this.currentIdx].key;
}
}
Run Code Online (Sandbox Code Playgroud)
我尝试将所有功能替换为:
computed: {
...this.config[this.currentIdx]
}
Run Code Online (Sandbox Code Playgroud)
它通过了编译,但我在浏览器控制台中出现错误。我认为问题在于computed需要函数,但扩展语法 (...) 返回对象。所以,我的问题是:在这种情况下,有没有办法减少重复?
谢谢!
我正在尝试从外部站点检索 vue 组件并将其加载到我的应用程序中,但我终生无法弄清楚这一点。
这是完整的场景;
假设我想从站点 B 加载一个非常简单的组件;
{
"template": "<div><span>{{message}}</span></div>",
"data": function() {
return { "message": "Hello World" };
}
}
Run Code Online (Sandbox Code Playgroud)
我已经尝试了以下方法,但结果喜忧参半;
在我的 index.ts 中(使用 TypeScript)
Vue.component('my-external-component', () => (Vue as any).http.get("http://test.local/test.js"));
Run Code Online (Sandbox Code Playgroud)
在我的 .vue 文件中
<my-external-component></my-external-component>
Run Code Online (Sandbox Code Playgroud)
这导致此注释被添加到 DOM
<!--function (a, b, c, d) { return createElement(vm, a, b, c, d, true); }-->
Run Code Online (Sandbox Code Playgroud)
但是添加
<component :is="my-external-component"></component>
Run Code Online (Sandbox Code Playgroud)
导致将空注释添加到 DOM
<!----> …Run Code Online (Sandbox Code Playgroud) 我想从实例外部访问 vm 数据,如下所示:
myComponent.vue
export default {
data() {
return {
name: 'Joe'
};
}
}
Run Code Online (Sandbox Code Playgroud)
主文件
var vm = new Vue({
el: '#app',
render: h => h(myComponent)
});
Run Code Online (Sandbox Code Playgroud)
想要的结果
console.log(vm.name); // should return - Joe
Run Code Online (Sandbox Code Playgroud)
出于某种原因,控制台返回未定义。我做错了什么?
我正在使用 vue 组装一个小应用程序,我特别需要它在不支持 ES6 的设备上运行。我正在使用vue-cli-service build构建,当尝试在我的 ES5 设备上打开此页面时,我看到此错误SyntaxError: Unexpected token '...'. Expected a property name.
我已经安装了 babel,并将其添加到我的 .babelrc 中: { "presets": ["@babel/preset-env"] }
我不确定还可以尝试什么,我找不到任何专门解决此问题的方法。甚至 vue-cli-service 文档也提出了支持 ES5 polyfill 的方法,但我认为这不是一回事。
我想在 Vue 项目管理器上创建一个项目。当我尝试时,我看到了该错误消息;
“vue create 是仅适用于 Vue CLI 3 的命令,而您正在使用 Vue CLI 2.9.6。”
这是我的 vue --version 输出:@vue/cli 4.0.5。
我怎样才能解决这个问题?
我的系统配置如下:
Ubuntu 18.04 Npm 6.13.0 节点 10.16.3
我做的:
vue create myfirstapp
atom (for open my editor)
cd myfirst app
npm run serve
Run Code Online (Sandbox Code Playgroud)
我明白了
> myfirstapp@0.1.0 serve /home/paolinsky/Documentos/vueBasico/fazt/myfirstapp
> vue-cli-service serve
INFO Starting development server...
10% building 2/2 modules 0 activeevents.js:196
throw er; // Unhandled 'error' event
^
Error: ENOSPC: System limit for number of file watchers reached, watch '/home/paolinsky/Documentos/vueBasico/fazt/myfirstapp/public'
at FSWatcher.<computed> (internal/fs/watchers.js:168:26)
at Object.watch (fs.js:1351:34)
at createFsWatchInstance (/home/paolinsky/Documentos/vueBasico/fazt/myfirstapp/node_modules/chokidar/lib/nodefs-handler.js:38:15)
at setFsWatchListener (/home/paolinsky/Documentos/vueBasico/fazt/myfirstapp/node_modules/chokidar/lib/nodefs-handler.js:81:15)
at FSWatcher.NodeFsHandler._watchWithNodeFs (/home/paolinsky/Documentos/vueBasico/fazt/myfirstapp/node_modules/chokidar/lib/nodefs-handler.js:233:14)
at FSWatcher.NodeFsHandler._handleDir (/home/paolinsky/Documentos/vueBasico/fazt/myfirstapp/node_modules/chokidar/lib/nodefs-handler.js:429:19)
at FSWatcher.<anonymous> (/home/paolinsky/Documentos/vueBasico/fazt/myfirstapp/node_modules/chokidar/lib/nodefs-handler.js:477:19)
at FSWatcher.<anonymous> (/home/paolinsky/Documentos/vueBasico/fazt/myfirstapp/node_modules/chokidar/lib/nodefs-handler.js:482:16)
at FSReqCallback.oncomplete (fs.js:165:5)
Emitted …Run Code Online (Sandbox Code Playgroud) 我想在 vue-cli 中设置自定义标头。
vue的版本是2.5.2。
我在 main.js 中尝试过:
import Vue from 'vue'
import App from './App'
import router from './router'
Vue.config.productionTip = false
Vue.http.headers.common['Cache-Control'] = 'no-cache, no-store, must-revalidate'
/* eslint-disable no-new */
new Vue({
el: '#app',
router,
template: '<App/>',
components: { App }
})
Run Code Online (Sandbox Code Playgroud)
但它返回:
Uncaught TypeError: Cannot read property 'headers' of undefined
Run Code Online (Sandbox Code Playgroud) 我已经开始了一个 Vue 3 项目(目前只不过是一个带有 TypeScript 的样板)并尝试向其中添加 i18n。
据我所知,vue-i18n 在 Vue 3 中不能正常工作;但 vue-i18n-next 应该。
这是我的 main.ts
import { createApp } from "vue";
import "./registerServiceWorker";
import router from "./router";
import store from "./store";
import { createI18n } from 'vue-i18n'
import App from "./App.vue";
//import en from "./locale/en.json"
//import ru from "./locale/ru.json"
const messages = {
en: {
message: {
hello: 'hello world'
}
},
ru: {
message: {
hello: '???? ????????????'
}
}
}
const i18n = createI18n({
locale: 'ru',
/* …Run Code Online (Sandbox Code Playgroud)