What is the best way to create a fresh Ionic 4 application without relying on Angular? Should I opt for Vue.js or stick with

As I delve into the world of Ionic 4, I find myself pondering how to initiate a new app without relying on Angular. The official guide makes reference to `ionic start` (link: https://ionicframework.com/docs/cli/commands/start/) for this purpose, where you specify the app name and template. However, this command typically generates a project structure geared towards Angular development. I vaguely recall stumbling upon a video tutorial that explains how to utilize Ionic with non-Angular frameworks such as Vue or even no framework at all, but unfortunately, it eludes me now.

javascriptionic-frameworkvue.jsionic4ionic-cli

Answer №1

After carefully reviewing the README, it appears that for those interested in creating an Ionic Vue application, the recommended approach is to first establish a project using Vue and then integrate Ionic into it.

Here's a snippet from Ionic's Vue README:

To begin, install @ionic/vue and @ionic/core via npm within your project and then proceed to register @ionic/vue as a plugin for your vue application.

So initially:

npm install @ionic/vue @ionic/core --save

Then, following the instructions outlined in the README:

import Vue from 'vue';
import Ionic from '@ionic/vue';
Vue.use(Ionic);

new Vue({
  router,
  store,
  render: h => h(App)
}).$mount('#app');

While I haven't personally tested this out, this would be my suggested course of action ;)

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

What is the best way to insert a row into a JavaScript table while incorporating a cell that utilizes the datepicker function in jQuery?

Currently, I am working on a javascript function: function addItem(tableID){ var table = document.getElementById(tableID); var rowCount = table.rows.length; var row = table.insertRow(rowCount); var cell1 = row.insertCell(0); var el ...

javascriptjqueryhtmldatepicker

Obtaining text from a select list using JQuery instead of retrieving the value

How can I retrieve the value from a select list using jQuery, as it seems to be returning the text within the options instead? Below is my simple code snippet: <select id="myselect"> <option selected="selected">All</option> <op ...

javascriptjquery

Is it possible to combine several m3u8 files into a single m3u8 file?

I am looking to consolidate multiple m3u8 files into a single file for seamless playback in one video player. How can I achieve this without compromising the individual clips? For instance, if I have zebra.m3u8, giraffe.m3u8, and lion.m3u8 files, is it pos ...

javascripthtmlhttp-live-streaminghls.js

Refresh client web pages with JSON data without using eval

I am currently working as a consultant on a web application that functions as a single page app. The main purpose of the app is to constantly fetch new json data in the background (approximately every minute) and then display it on the screen. Our clients ...

javascriptjqueryjsongoogle-chrome

I'm experiencing some unexpected behavior with the Laravel 8 API $request

I am using a Vue component to send this request: data(){ return{ email:"<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="74073419115a171b19">[email protected]</a>" } }, methods:{ reset ...

laravelapivue.js

JavaScript: Implementing a for loop to dynamically adjust CSS properties

How can I adjust the margin-top property of the ball element when clicking a button? Below is my current code, but it's not working as expected. Can you help? let ballMargin = ball.style.marginTop; moveButton.addEventListener('click', funct ...

javascript

Utilizing Vue Components in ASP.NET MVC Partial Views: A Step-by-Step Guide

As I delve into learning Vue.js and work on an asp.net mvc 5 web application that currently relies heavily on jQuery, my goal is to gradually integrate Vue and phase out jQuery. After dedicating a few days to incorporating Vue into the asp.net mvc 5 proje ...

asp.net-mvcvue.jsvuejs2

What is the best way to create a simulation of a NOR gate using JavaScript?

Can a NOR gate be emulated in JavaScript? It seems that the language only supports AND and OR gates at this time. ...

javascript

The passport local strategy functions properly when tested with Postman, but encounters a "missing credentials" error when used with axios

I am currently working on creating a login system using passport and a local strategy. Strangely, when I attempt to send the request through axios it doesn't seem to work, although it functions properly with Postman. When using axios, I receive an er ...

javascriptnode.jsexpressaxiospassport.js

The "session expire=null not working" issue persists with Google Chrome

Based on the documentation for Connect, sessions are expected to expire when the browser is closed: By default, the cookie.maxAge parameter is set to null, making the cookie a browser-session cookie. When the user closes their browser, the cookie (and s ...

javascriptsessionnode.jsgoogle-chromeexpress

Tips for passing a string as a whole value rather than separated values

Recently, I encountered a strange issue within my code. I have a function named onClick which is triggered by a div and calls a dispatch function. It passes the target value (e.target.value) into the dispatch function, where it is stored in an array. The ...

javascriptarraysreactjsreduxreact-redux

Data retrieval issue with ng-table displaying information queried from HTTP request

I have been attempting to create an ng-table using ajax data with angularjs and rails. Despite successfully retrieving the data through an http get request, I am encountering difficulties appending it to my table as it always displays no records. Below is ...

javascriptruby-on-railsangularjsngtable

Intermittent issue with div background switching feature on Firefox

There's a div where background images are changed using a script. I've simplified everything here: Sometimes, in Firefox, an error occurs about 10% of the time that looks like this: https://i.sstatic.net/JvSfx.png Everything seems to work fine i ...

javascriptjqueryhtmlcss

Preventing Duplicate Header Sending in Node.js with Express

Encountering an error "Can't set headers after they are sent to the client" led me to discover that my code is attempting to send two responses that try to modify the previously set headers. To resolve this issue, I added a return keyword to halt fun ...

javascriptnode.jsexpress

Tips for triggering an event from a function instead of the window

Everything is functioning as expected, with the event listener successfully capturing the custom event when it is dispatched from the window and listened for as loading, all seems to be working well. const MyLib = mylib(); function mylib() { const re ...

javascripttypescript

Troubleshooting CSS animations disrupted by ng-show/ng-hide

I am utilizing CSS animations to showcase a graph in my Angular application. However, the graph is only visible once an AJAX request has finished and actual data is available for display. In order to achieve this, I am using ng-show to conceal the graph e ...

javascriptcssangularjsanimation

The DataTable is encountering difficulties with processing JSON data retrieved from the database

Setting up a datatable on my website has been quite the challenge. I came across a table that I wanted to use here, but converting it to fit my needs has not been successful. Currently, the table is not populating with rows from a database table and I&apos ...

javascriptphpjsonajaxdatabase

I'm facing an issue with my owl Carousel not functioning properly in my initial setup. Can anyone help me identify the error?

I've made several attempts but still can't figure out where my error lies. Why doesn't it work for me? It's the "OWL CAROUSEL CUSTOM". I've tried different types of owl carousels and none of them seem to run on my computer. I reall ...

javascriptjqueryhtmlcssowl-carousel

Implementing a validator based on the operator selection in react-querybuilder

Is it possible to add validators to fields that are only active when using the like operator? For example, if the like or unlike operators are used in the phoneNumber field without the % sign, it should be invalid. If the = operator is used, the % sign sho ...

javascriptreactjsquery-builder

"Exploring the Latest Features of NextJS 13: Enhancing Server

Currently, I am in the process of familiarizing myself with NextJS 13 and its new APP folder structure. I am facing a challenge in updating data on server components without needing to reload the page or the app. My HomePage server component fetches a list ...

javascriptreactjsnext.jsnext.js13