I'm using the brunch build system, and want to use a .php index file instead of .html. I get the following error when I watch the server.
Error: ENOENT: no such file or directory, stat '/Users/indigoshade/Desktop/test/simple/public/index.html'
How do I have brunch look for index.php instead of index.html?
PHP is a server-side programming language so the code has to be interpreted before it can be shown on the web page. This is done on the server ("the backend"). Brunch is focused on Javascript, HTML, CSS etc ("the frontend").
To get started with locally developing PHP applications, I suggest following some tutorial. I am sure that you can find some on Google .😉
Yes I'm aware of that. I just wanted to use brunch on 95% java-script application that used php, I like the live-reload. I found a solution for live reload on any local application using the OSX app LiveReload.
Related
I was using npm run build to build my page for production, and I check the /build folder the source code doesn't exists. But when I host the host the website via IIS or httpd and use the browser to open the page, I found the source code is in there! That means anyone can grab my code and build their own website? Wired.
In your build directory, you'll see some .map files. Those are source maps, and they contain all the data necessary to rebuild things in the way you see files on-disk, even though everything is bundled for the browser.
These are useful development tools. They allow you to set breakpoints. You can even see code from other languages that was transpiled.
You should disable sourcemaps for your production builds.
This question already has answers here:
Which command do I use to generate the build of a Vue app?
(19 answers)
Closed 4 years ago.
I think I have a bit of a mess here. I have my vue app running in my localhost environment. I want to deploy to a server I have hired. Which are the steps to accomplish this?
I have installed nodejs and npm on the server. At a first glance I tried to go the way I always did when using php, running nodejs app through apache server but it seems it is not the best option from what I read. In my local machine I run:
npm run serve
to start a server to run my vue app locally. Should I do same thing on my remote server? Are there better options?
Should I do same thing on my remote server?
Definitely no.
Notice in your package.json file you should have a script called "build", i.e. you can execute it with the command:
$ npm run build
Once executed, it should compile your Vue project and place the resulting files in a dist folder at the root of your project.
Notice that these files are plain HTML, JS (for browser, since Vue is only for front end) and CSS (plus any of your project assets if applicable).
Since you are familiar with PHP, you should know what to do with those files. Should your project be "simple" and not require backend services (like AJAX, REST, etc.), you can actually serve them on a simple server (no need for PHP, Node, etc.).
Otherwise, you should have plenty tutorials and resources online explaining how to publish those files on a simple server.
The "deployment process" in our company (if you can even call it that) is that you usually (not always) make the site locally, then upload it to the server and after that do all changes on live server (yep...).
I am trying to push SASS in our company, but my boss basically told me that if there isn't a way for it to autocompile after a change has been made on the server, I can just throw away all my work reworking our styles to SASS and go back to pure CSS.
Here is folder structure sample of our server (we do have multiple sites running on same machine, they're all in separate sub-folders, but not all of them have frontends):
var/www/our_system/project_name1/web-frontend/frontend_name1
var/www/our_system/project_name1/web-frontend/frontend_name2
var/www/our_system/project_name2/web-frontend/frontend_name1
var/www/our_system/project_name3/web-frontend/
The frontend_nameX contains a style folder which contains folders scss and css (where I want to autocompile contents of scss into the css folder).
So, the question again:
Is there a way, to have SASS permanently watch over any sass file changes and compile them to a css folder relative to the sass folder the compiled file was in (as my boss doesn't want to run watch command for every single website)? Also, it would be amazing if it could also run the CSS through Autoprefixer.
Thanks.
Ps.: We are using our own custom CRM/CMS written in PHP, there are no other frameworks etc. Front-ends are also written in PHP and HTML (no react, node, anything of sorts). Our server runs on Debian Jessie (and for PHP we use Apache).
Ps.2: Please, do not tell me that we are doing it wrong etc. I KNOW, but I can't do anything about it.
Edit:
I got my boss to try and install Gulp on our server to take care of this, but the installation itself actually failed.
The node was installed fine, same with npm (well, I think it threw some warnings, but got installed), but gulp just threw warnings and errored out (it installed fine globally, but died when installing for the project)...
The new question is, is the gulp way to go?
All we need is something that autostarts and keeps watching all scss files and parses them when they change.
Thanks.
I'm trying to include a javascript file which is not available as bower.
So I copied it to src/main/webapp/content and referenced in index.html
In the DEV profile all is fine -- it works.
Now, after generating WAR file with the PROD profile, the custom.js file is not included in the WAR (tried to unpack -- file is not there).
I have discovered the gulp is merging all css and js files, did I miss a config for this?
When the app is loaded, the browser complains with 404 in the index.html -- js file not found.
How can I fix this? What is the right way to include JS (or CSS) file into JHipster app?
Thank you.
JS are not expected to be in content folder.
For CSS, copy your file to src/main/webapp/content/css.
For JS, copy your file to src/main/webapp/app possibly in a dedicated sub folder.
You don't have to inject them in index.html, gulp will do it for you. I suppose you did not see it in dev profile because you were not running gulp serve as explained in the doc
So I have created a pretty default keystoneJS project and the first error that appeared was that when ran locally the website's default css won't load.
It's looking for site.min.css but in the folder there is only site.scss
After I compiled the scss via sublime text 2 sublimeBuild and renamed the file to site.min.css (from site.css) it ran perfectly but what worries me is why does the default installation have this error.
Where should I change this? Is there an scss builder included so I have to change folder naming or is there some other issue?
My guess is that it has something to do with some step skipped. I remember the keystone installation asked me whether I wanted to use sass so I suppose everything should be ok.
Is the problem because I did not use grunt somehow?
I recall reading somewhere that this grunt tool has to be used instead of node when running a server and I see a Gruntfile in my folder but when installed grunt-cli the grunt just loads and terminates the server right after that.
You don't have to do anything, sass-middleware is included and automatically generates CSS files from your SASS source files when they're requested.
The issue you were experiencing with site.min.css not being found was an error in the yeoman generator, from when the SASS support was added. The LESS middleware automatically compresses generated CSS when a request is made for a file ending in .min.css, but the SASS middleware doesn't do the same, so the request was 404'ing.
The problem with the yeoman generator has been fixed as of version 0.2.9, for existing projects the simple fix is to change your layout file so it refers to site.css instead of site.min.css.
Once you do that the middleware will automatically detect the presence of site.scss and generate an up-to-date version of site.css for you.