I believe I have a webpack configuration change that needs to be made by creating a vue.config file? Some guidance is appreciated.
I have this directory structure
src/assets/backgrounds/desktop
src/assets/backgrounds/mobile
src/assets/backgrounds/
src/assets/flags/
src/assets/fonts/
src/assets/logo/
src/assets/sounds/
My issue is that when I run
npm run build (vue-cli-service build)
The build doesn't create the subdirectories in the backgrounds folder.
src/assets/backgrounds/desktop
src/assets/backgrounds/mobile
I end up with a dist folder like so.
dist/css/
dist/img/
dist/js/
dist/media/
dist/
I was expecting
dist/img/desktop/
dist/img/mobile/
Any help is appreciated, thank you.
As said in the folowing documentation, static assets have to be put in /public folder:
https://cli.vuejs.org/guide/html-and-static-assets.html#static-assets-handling
In your case:
public/img/desktop/
public/img/mobile/
Related
I'm trying to create my first cra-template on NPM and for some weird reason when I try my template locally using the file:./cra-template-[mytemplate] everything copy overs without problem. When I publish it and try using the npx create-react-app my-project --template [mytemplate] all files are being installed but not folder structure. What am I doing wrong?
My Folder structure goes like that :
template
|
|--src
|
|--api
|--components
ect..
Thank you for the help
Ok so I figured it out. You need to actually put a file inside the folder, .gitkeep as an example. If you don’t github is not going to create an empty folder and so when you are going to pull your template all files are going to be there but no folder.
I have multiple package.json files in my project in different folders. VSCode reads scripts from all the files and shows them up in the "NPM SCRIPTS" panel. I want to show scripts only from the root package.json file. How to add config to the project to read only the root package.json or maybe set a precise path to it. Is it possible? Thanks for any help
Not exactly sure why this glob works, but this setting (in settings.json) seems to work:
"npm.exclude": "**/folder-operations/**"
where folder-operations would be your root folder.
Whenever I was creating a new Nuxt project, there were directories like: components, pages, static, store, .nuxt, node_modules but there are no layouts and other directories as of right now.
How can I fix that?
You are probably referring to this question: Some of the directories are missing when I'm trying to create a new Nuxt js project
My answer is in there!
Also, .nuxt is a cache directory that you should not touch to, same goes for node_modules so far. node_modules will be available if you yarn normally.
PS: this is based on the assumption that you are doing npx create-nuxt-app <project-name>.
I have a VueJS app that I would like to deploy, i'm currently running npm run build to build the app, however I want this app to be in a subdirectory of my website.
The problem i'm having is when building the app, it creates the wrong paths to the css and javascript file.
I have tried using root inside babel.config.js but it gives me an error when I try to build it (root is only allowed in root programmatic options).
Anyone know how I can go about fixing this issue? Any help is greatly appreciated!
Check out the publicPath and base options:
https://cli.vuejs.org/config/#publicpath
https://router.vuejs.org/api/#base
Possibly you will also need to adjust your webserver config if using history mode:
https://router.vuejs.org/guide/essentials/history-mode.html#example-server-configurations
I am new to vuejs. Recently I noticed that when I pull, it says conflict in app.js file. But I can't find the issue as app.js file is big.
Sould I add this file to gitignore file?
what is best practice to work with vue js?
I imagine you are building to a folder /dist and the app.js being conflited is the one inside of it.
You should ignore the /dist altogether. This folder is generated on the building process, meaning everyone that runs the project will update and create it.
Here is the default vue-cli .gitignore:
.DS_Store
node_modules
/dist
# local env files
.env.local
.env.*.local
# Log files
npm-debug.log*
yarn-debug.log*
yarn-error.log*
# Editor directories and files
.idea
.vscode
*.suo
*.ntvs*
*.njsproj
*.sln
*.sw*
Not that not anything here may be useful to put in your own .gitignore. But you should for sure have at least node_modules and /dist.
If you are building the Vue project by scratch then I can say the following, when building/compiling your Vue project, best practices say that you should handle your entire production ready project in a dist/ or build/ directory where your main app.js file where the conflicts you are having would occur. This directory is only reserved for deploying the app and is not saved into your code repository, hence on why you should add to the .gitignore file the directory that holds such production files.