I have a problem with Visual Studio Code. I am using less files so added extensions to auto generate .css and other to make .min.css files. The problem is "ftp-simple" and "sftp" extensions which are used to auto send files to my server after saving do not send .css or min.css. Maybe someone has the same problem and knows solutions?
if i save my css file it works - send to serv. But wanna make it automaticly after save less
after long searching I found that in an extension calles "SFTP" by Natizyskunk You can add a watch which would upload generated files on save.
So now I must only save .less and have .css and .css.map on my serv.
sftp.json code:
{
"name": "your_name",
"host": "your_host",
"protocol": "ftp",
"port": 21,
"username": "your_username",
"password": "your_password",
"remotePath": "/",
"uploadOnSave": true,
"watcher": {
"files": "**/*.{jss,css,css.map,.min.css,.min.js}",
"autoUpload": true,
"autoDelete": false
},
"useTempFile": false,
"openSsh": false
}
Related
Created an app in vue-cli and then I build the dist folder for production with a new app version.
The problem occurs when I have to make some changes and I have to redo the deployment. After this,App doesn't work with updated version but if I clear the chrome cache in the site settings of the particular site , the app works fine again.
The app is deployed on Firebase Hosting.
A solution to clear chrome cache when I release a new vue version?
The "smart" caching can be done by the server-side technology. If you have access to this and can manage the type of caching, you can set it to use etag, which I've found is quite reliable.
Vue apps, bundled using webpack, will generate filenames with hashes. So if there is anything different in the app, or chunk(if you're code splitting) the generated file names will be different. The issue though is that the index.html will keep the same name. So if you can set the correct caching options for that file alone, that will solve most of your problems. Alternatively, you can set a really short cache time or no cache at all (since it should be a small file) if you're concerned about the page loading from cache. But the problem still remains that this part of the caching functionality is entirely out of reach of the vue app.
Looks like with firebase you can edit the configuration and set headers per resource ref
so you could set a long max-age for css and js, and short for index.html like so...
"headers": [ {
"source": "**/*.#(eot|otf|ttf|ttc|woff|font.css)",
"headers": [ {
"key": "Access-Control-Allow-Origin",
"value": "*"
} ]
}, {
"source": "**/*.#(jpg|jpeg|gif|png|js|css)",
"headers": [ {
"key": "Cache-Control",
"value": "max-age=7200"
} ]
}, {
"source": "index.html",
"headers": [ {
"key": "Cache-Control",
"value": "max-age=300"
} ]
} ],
I had the same problem when updating my project.solution :the version number in package.json before running the build command fixed it.
package.json file:
{
"name": "project-name",
"version": "0.1.1",
"private": true,
...
}
I'm developing an Azure DevOps extension, which displays the a summary of work items for the current Sprint for printing.
I am failing to get static CSS files to publish correctly.
I have the following configured in the manifest.json in the files section:
{
"path": "css/print.css",
"contentType": "text/css",
"addressable": true
},
{
"path": "css/screen.css",
"contentType": "text/css",
"addressable": true
},
The structure of the project is:
css/screen.css
css/print.css
board-cards.html
vss-extension.json
Reading this documentation: https://learn.microsoft.com/en-us/azure/devops/extend/develop/static-content indicates that the static content should be published to: https://publisher.gallery.vsassets.io.
When debugging - the following two 404's appear in the network log:
https://publisher.gallerycdn.vsassets.io/css/print.css
https://publisher.gallerycdn.vsassets.io/css/screen.css
(I've changed my publisher account name to the generic "publisher" string for ease)
I've opened the .vsix in 7zip, and the folder and css files are in the package. After many hours of Googling and hunting through stackoverflow, I'm unable to find a solution.
I tried changing the entry in "files" to be simply:
{
"path": "css",
"addressable": true
}
However this had no effect.
Is anyone able to advise me on what I'm missing or doing wrong?
Through further debugging I've found that the files do exist under a URL specific the the version published.
e.g. https://publisher.gallerycdn.vsassets.io/extensions/publisher/board-cards/1.0.64/1545996658773/css/screen.css
And then I checked the mark-up, and I realised I'd made an absolute reference to the CSS files. E.g.
/css/screen.css
By removing the first slash - this made the reference to the CSS file relative, which solved the problem.
HTML 101.
JHipster i using the webpack to serve static files to users, but in my app i want images to load asynchronicly without webpack.
If i understand webpack correctly it is including all files that match the regexp and bundles them.
And any image file that lies in webapp folder will be included
This is the standart image-loader conf for jhipster app.
{
test: /\.(jpe?g|png|gif|svg|woff|woff2|ttf|eot)$/i,
loaders: [
'file-loader?hash=sha512&digest=hex&name=[hash].[ext]', {
loader: 'image-webpack-loader',
query: {
gifsicle: {
interlaced: false
},
optipng: {
optimizationLevel: 7
}
}
}
]
}
I store the images url in database and wanted to use the spring resource handler to get the images.
Can anyone please tell me what is the correct way of writing the static resource path for jhipster defoult configuration.
I tryed to use /content/webapp/images/ ...
But it does not seem to work which is strange considered that all static files are located there.
I am trying to setup less on my nodejs project and when i request my page from browser less-middleware debug show me wrong path and dest path. When i ask for example '/public/css/index.css' from my webpage i adds '/public/css/' to the source path. Below are mine configures:
app.use(lessMiddleware(__dirname+'/server/less',{
debug: true,
dest: __dirname+'/public/css',
once: true
}));
And debug screen shows:
pathname : /public/css/index.css
source : D\Work\project\server\less\public\css\index.less
destination : D\Work\project\public\css\public\css\index.css
Even if i fix the destination path, i am having problem with source and i dont want to put my less files into public folder. Is there a way of remove that /public/css from compiled less.
I have tried to add:
'preprocess.path': function(pathname, req){
console.log(pathname);
}
but console.log never shows. Also perhaps there is a way to not compile every css file users ask and just compile those less files which i have in less folder.
P.S. every module i am using is under "*" version.
You might try this (accessing "/css/style.css" within your browser):
app.use(lessMiddleware({
src: __dirname+"/server/less",
dest: __dirname+"/public/css",
prefix: "/css",
// force true recompiles on every request... not the
// best for production, but fine in debug while working
// through changes
force: true,
debug: true
}));
Actually it was simple enough.
app.use(lessMiddleware(__dirname+'/server/less/',{
debug: true,
dest: __dirname,
force: true
}));
So now in the folder /server/less we create folder public/css and everything is pulling in right way. Also if we have folder admin/css it works too. Trick was to create folders in folder /server/less
We are using Grunt to compile and concatenate our typescript files into a single javascript file located in our distribution folder. That functionality is working properly, but Grunt also creates .map and .js files for every ts file it finds; auto-generating them in the same location as the TS files.
Is there a way to prevent grunt from making these extra files and just generate the output.js and output.map?
This is a snip of our grunt.js file.
ts: {
task : {
src: ["**/*.ts", "!node_modules/**/*.ts"],
out: 'app/dist/app.js'
},
options: {
fast: 'never'
}
},
watch: {
typescript: {
files: '**/**/*.ts',
tasks: ['ts']
},
sass: {
files: '**/**/*.scss',
tasks: ['sass']
}
}
In tsconfig.json turn off the compileOnSave option to signal to IDEs not to generate all files for a given configuration upon saving:
{
"compileOnSave": false
}
Not all IDEs currently obey the option. See https://www.typescriptlang.org/docs/handbook/tsconfig-json.html for more detail.
It seams that your IDE is compiling your TS files.
It happens with me once with webstorm,
Witch IDE are you using?
Try to disable typescript compiler.
In case you are using webstorm:
Ctrl+Alt+S
Search for typescript under Languages & Frameworks
uncheck "Enable TypeScript Compiler" checkbox