Ionic 4 with AngularJS + Cordova + Webpack

#1

I don’t want Angular7 in my new Ionic project. Ionic declares that Ionic 4 is framework agnostic, but their CLI seems to be only friendly with Angular7.

I would like to create a project using AngularJS version 1.7.2, compiled with webpack - so I can have the ability to export and import files, and wrapped by cordova so I can bundle it to the AppStores.

However there isn’t any boilerplate under the hood and I started creating a new one but mess with too many things.

I wonder if there any good tutorial making this work the same way I would like?

Furthermore, is there any method to allow using the Ionic CLI with none angular project? for example, on pure JS?

#2

As far as I know this feature doesn’t exist. On the other side, dropping Ionic in any projects respectively in an “no framework” project is pretty easy

Don’t know if it’s a good tutorial, but I wrote an article about how to import and use Ionic without Framework (basically the same as using it in any projects): https://medium.com/@david.dalbusco/using-ionic-without-any-frameworks-775dc757e5e8

Also in my project DeckDeckGo, I use Ionic without Framework and I bundle the presentation with Webpack, if you want to have a look: https://github.com/deckgo/deckdeckgo-starter

I hope this helps a bit

#3

I have read your article. I don’t find an issue in order to involve the Ionic with my project. I am finding an issue to involve my project with cordova and webpack.

For example I have just an index.html file which is getting bundled with wepback to a dist folder.
This charm is getting actioned in the www folder which is inside the cordova project.

I will start earlier: I have started the project using cordova create test and then in the www folder I want to have the webpack and Ionic. If you don’t understand me I can send you a Github invitation.

#4

I see, maybe Cordova.js is missing? When building it should inject something like <script type="text/javascript" src="cordova.b04376d424a21d95d017.js"></script> in the index.html file

Maybe you could have a look in the source of the Ionic CLI https://github.com/ionic-team/ionic-cli to see how they do that?

#5

I have made index.html and bundle.js using webpack in the www directory then ran cordova run android.
The app is getting actioned but angularjs cannot run since this running without server/node.

Do you know how can I solve this?
I mean, if you just open a html file that has angularjs in it it won’t work, you should serve it on a localhost with a port using some http server or node.

How to do this using the cordova?

#6

My understanding was that Cordova would package what’s under www folder in the app and then will run it

Like if you have a simple index.html and index.js files in your www, if you cordova platform add android and cordova build android my understanding was that the output should be an app which will run your app

You also probably need this plugin to run the webview or wkwebview https://github.com/ionic-team/cordova-plugin-ionic-webview

Honestly more than that I don’t know, never tried

1 Like