vue-cli-3

vue-cli3 public folder img doesn't show up

时光总嘲笑我的痴心妄想 提交于 2020-04-07 09:08:21
问题 Does anyone know how to use the src attribute with an img file in a vue project's public folder? The browser is not finding the image. I'm using Vue CLI 3.7.0 ▼ folders | +-- src | +-- public | +-- favicon.ico +-- logo.png +-- index.html I've tried something like :src="xxx" , but that didn't work. <template> <div> <img :src="'/favicon.ico'"> <img :src="`${publicPath}favicon.ico`"> </div> </template> <script> export default { data: function() { return { publicPath: process.env.BASE_URL }; } }

vue-cli3 public folder img doesn't show up

若如初见. 提交于 2020-04-07 09:07:56
问题 Does anyone know how to use the src attribute with an img file in a vue project's public folder? The browser is not finding the image. I'm using Vue CLI 3.7.0 ▼ folders | +-- src | +-- public | +-- favicon.ico +-- logo.png +-- index.html I've tried something like :src="xxx" , but that didn't work. <template> <div> <img :src="'/favicon.ico'"> <img :src="`${publicPath}favicon.ico`"> </div> </template> <script> export default { data: function() { return { publicPath: process.env.BASE_URL }; } }

VUE CLI 3 - How to import scripts and styles

落花浮王杯 提交于 2020-02-01 04:41:26
问题 Please I have been trying to import local styles and javascript files into my newly created VUE-CLI 3 application (inside public/index.hml) but they are not reflecting in my components. Using Vue-cli 2 it works. Are we not supposed to import css and styles in public/index.hml Please how do i get this to work? Please help. See below how i referenced the files in public/index.html file <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport"

How do I add cssnano optimization rules in vue-cli 3?

懵懂的女人 提交于 2020-01-24 19:49:04
问题 I am trying to add cssnano optimization rules but with vue-cli, it doesn't seem to work. I added the following script in vue.config.js : module.exports = { css: { loaderOptions: { postcss: { plugins: [ require("cssnano")({ preset: [ "default", { discardComments: { removeAll: true }, mergeRules: true } ] }) ] } } } }; But it wouldn't work (see screenshot below) Screenshot - cssnano mergeRules didn't apply: What did I miss? 回答1: You have to modify chainWebpack api to edit cssnano plugin options

Vue CLI - Keep config file as external after compilation

巧了我就是萌 提交于 2020-01-23 01:30:06
问题 I'm developing an application with Vue CLI. This application is a web interface which will have to communicate with a Rest API on a board. So, because the board will move, the IP of the board will change over time depending on where I am. This is my project current tree : The IP configuration is contained in the Settings.js file : export const Settings = { // Server configuration SERVER_IP: '127.0.0.1', SERVER_PORT: '9000', SERVER_PROTOCOL: 'http', // http or https // Website configuration

How enable console log in VUE-CLI during development

ぐ巨炮叔叔 提交于 2020-01-16 08:48:08
问题 Hello there community. I have been trying to figure out how to console.log('whatever') during learning some VueJs development in my methods in order to understand some behaviour of whatever I am doing here. I understand that there are some questions already asked here and I have scoped into eslint documentation to try an figure this out... I just cannot actually understand what should I do. This is my methods: methods: { submitData() { this.$http.post('https://vue-testing-8a2de.firebaseio.com

Vue devServer proxy is not helping, I still get CORS error

萝らか妹 提交于 2020-01-14 09:41:48
问题 I'm using @vue/cli 3.x and in my vue.config.js I have this: devServer: { proxy: { "/api": { ws: true, changeOrigin: true, target: "http://localhost:8080" } } } But I keep getting CORS error: Access to XMLHttpRequest at 'http://localhost:8080/api' from origin 'http://localhost:3000' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. Any idea? 回答1: It looks like the problem was with the axios configurations. I had this definition:

How to setup a vue-cli with vuetify project to run with IE 11?

≡放荡痞女 提交于 2020-01-02 06:06:06
问题 I spend a few days to setup a vue.js + vue-cli + typescript + vuetify project to run with IE 11 without success? I found many posts on the net that explain how it should be done but without success. I tried to combine in almost all the ways possible the setup explained below without success, endind with many different errors up to a blank page The application runs fine wit Chrome or FF If someone has such an application running in IE 11 it would be greatly appreciated Context (all the latest

How to separate a specified file using webpack in vue-cli project

ⅰ亾dé卋堺 提交于 2019-12-25 18:50:57
问题 I have a config file (config.js), which depends on two files: local.js(for development environment) and deploy.js(for production environment). After run serve or run build , it will create some configurations rely on the environment. I used it like the following: <template> </template> <script> import config from '@/assets/scripts/config.js' export default { data() { return { apiBasePath: config.apiBasePath } } } </script> My config.js: import local from '../../../config/local' import deploy

SSR build says “document is not defined” for a Vuejs cli3 SPA app using a Vue cli3 library

允我心安 提交于 2019-12-22 08:04:11
问题 I have a fairly complex SPA Vue.js app created with Vue CLI v3. I want to transform this app to benefit from SSR (although I might end up using only preprendering...) My app is using custom Vuejs libraries created with the CLI v3 as well. These libs embbed CSS, and I would like to continue to do so. I've probably read everything that the world has produced on Vue cli, vue-loader, vue-style-loader, vue.config.js, extract css etc, but I keep failing. Here is the error message of my running app