danijelh / aspnetcore-vue-typescript-template Goto Github PK
View Code? Open in Web Editor NEWTemplate AspNetCore with Vue, Vue router, Vuex, TypeScript, Bulma, Sass and Jest
License: MIT License
Template AspNetCore with Vue, Vue router, Vuex, TypeScript, Bulma, Sass and Jest
License: MIT License
I had to install node-sass manually
npm install -save-dev node-sass
Before the js side of the app would build properly.
I quess people who use sass usually have this installed globally, so it's missing from the template?
npm verb stack Error: 404 Not Found: [email protected]
npm verb stack at fetch.then.res (C:\Program Files\nodejs\node_modules\npm\node_modules\pacote\lib\fetchers\registry\fetch.js:42:19)
npm verb stack at tryCatcher (C:\Program Files\nodejs\node_modules\npm\node_modules\bluebird\js\release\util.js:16:23)
npm verb stack at Promise._settlePromiseFromHandler (C:\Program Files\nodejs\node_modules\npm\node_modules\bluebird\js\release\promise.js:512:31)
npm verb stack at Promise._settlePromise (C:\Program Files\nodejs\node_modules\npm\node_modules\bluebird\js\release\promise.js:569:18)
npm verb stack at Promise._settlePromise0 (C:\Program Files\nodejs\node_modules\npm\node_modules\bluebird\js\release\promise.js:614:10)
npm verb stack at Promise._settlePromises (C:\Program Files\nodejs\node_modules\npm\node_modules\bluebird\js\release\promise.js:694:18)
npm verb stack at _drainQueueStep (C:\Program Files\nodejs\node_modules\npm\node_modules\bluebird\js\release\async.js:138:12)
npm verb stack at _drainQueue (C:\Program Files\nodejs\node_modules\npm\node_modules\bluebird\js\release\async.js:131:9)
npm verb stack at Async._drainQueues (C:\Program Files\nodejs\node_modules\npm\node_modules\bluebird\js\release\async.js:147:5)
npm verb stack at Immediate.Async.drainQueues [as _onImmediate] (C:\Program Files\nodejs\node_modules\npm\node_modules\bluebird\js\release\async.js:17:14)
npm verb stack at processImmediate (timers.js:632:19)
npm verb cwd C:\dev\Playground\Web.VueTs\Web.VueTs
npm verb Windows_NT 10.0.17763
npm verb argv "C:\Program Files\nodejs\node.exe" "C:\Program Files\nodejs\node_modules\npm\bin\npm-cli.js" "install" "--verbose"
npm verb node v11.8.0
npm verb npm v6.5.0
npm ERR! code E404
npm ERR! 404 Not Found: [email protected]
npm verb exit [ 1, true ]
This project can't run with dotnet core 3.0, can you update it in order to run with dotnet core 3.0 and above.
First of all, thank you for this awesome repo.
Just need a help with publishing to Azure VM. While I can publish to local folders without any issues, I got some errors when trying to publish to Azure VM via Web Deploy.
The following errors have stopped me from publishing:
Severity Code Description Project File Line Suppression State
Error TS1148 (TS) Cannot use imports, exports, or module augmentations when '--module' is 'none'. Miscellaneous ~\iceandfire\App.vue 36 Active
Severity Code Description Project File Line Suppression State
Error TS1219 (TS) Experimental support for decorators is a feature that is subject to change in a future release. Set the 'experimentalDecorators' option to remove this warning. Miscellaneous ~\iceandfire\App.vue 46 Active
Error TS2307 (TS) Cannot find module 'vue'. Miscellaneous ~\iceandfire\App.vue 36 Active
Error TS2307 (TS) Cannot find module 'vue-property-decorator'. Miscellaneous ~\iceandfire\App.vue 37 Active
Any help would be appreciated. Thanks.
๐
Hi there, I was wondering if you could create the following:
ASP.Net Core 3.1
Vue.js (latest)
HMR
WebPack
Razor Pages/MVC (either is fine)
SCSS support
I have been having so much trouble just getting one of the many "attempts" out there to work and not be all about the SPA.
Thanks
How difficult would it be to create a version of this that uses plain JS and CSS? Perhaps you would consider a branch or a follow up post on this topic.
I like the multi-page app format and this is the closest I have found. I'm trying to avoid having to learn so many technologies all at once so a version of this without TS and SASS would help trim it down a bit.
Hi Mate, I just wanted to say Fantastic Article, and AMAZING Repo you have here! Great work.
Your repo confirmed a few things I was wondering if was possible. I do alot of work for clients, whom already have existing stuff. I was saavy with vue cli (and I love it), but often would not get to work with it on clients software.
What you have provided here is a means of integrating multiple mini spas accross multiple razor pages and I rekon this is awesome.
cheers
Hi @danijelh would you mind to show me how I add Vuetify in the project? Thanks.
I tested several times, and HMR does not work. Does it work for you?
Just a heads up.
I saw your previous #5 issue on HMR not working.
I added the following to the Startup.Configure method.
using Microsoft.AspNetCore.SpaServices.Webpack;
app.UseWebpackDevMiddleware(new WebpackDevMiddlewareOptions { HotModuleReplacement = true });
Once I do this, HMR works just fine. I don't have to hit F5 all I have to do is hit save.
Could you give an example of how to localize the client apps?
I'm using 'ResxToJson' nuget package to convert resx files to i18n format via a build task, but how would I then integrate the generated Javascript into the client.
Do you suggest putting the i18n files into the common folder, or have one i18n file per app? I would like to integrate 'vue-i18n'.
https://kazupon.github.io/vue-i18n/
thanks in advance!
Let's say we have initial webpack.config.js where options of vue-loader specified as:
{
test: /\.vue$/,
loader: "vue-loader",
options: {
preserveWhitespace: false,
loaders: {
scss: "vue-style-loader!css-loader!sass-loader", // <style lang="scss">
sass: "vue-style-loader!css-loader!sass-loader?indentedSyntax" // <style lang="sass">
}
}
}
and in VueApp/idontneedtypescript/App.vue styles specified without lang="scss":
<style scoped>
.custom-class {
background: red;
}
</style>
Then vue-loader does not include simple css styles in extracted css file in wwwroot/dist/css/main.css.
Hi Daniel,
I love this repo. I keep coming back to it because I find it so interesting.
I have a question for you please,
Do you think its possible to combine react together in this project? Or would it make the Webpack config tooooo crazy?
Did you ever experiment with using a central store? maybe using LocalStorage hooked up to Vuex so the different isolated Vue apps could still talk to each other? Maybe to do this there would need to be some kind of eventing system which is shared between the different SPAs I suppose?
Your Answers would be very much appreciated If you have the time
Kind Regards
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.