adding vue

This commit is contained in:
andy 2021-11-09 18:17:22 +00:00
parent 6e05647676
commit 40d7b3e676
9 changed files with 1004 additions and 36 deletions

View File

@ -6,6 +6,9 @@
<div class="text-center"> <div class="text-center">
<h1 class="display-4">Now</h1> <h1 class="display-4">Now</h1>
<div id="app">
<h1>{{ count }}</h1>
</div>
</div> </div>
@section Scripts { @section Scripts {

View File

@ -20,6 +20,9 @@
<li class="nav-item"> <li class="nav-item">
<a class="nav-link text-dark" asp-area="" asp-page="/Index">Home</a> <a class="nav-link text-dark" asp-area="" asp-page="/Index">Home</a>
</li> </li>
<li class="nav-item">
<a class="nav-link text-dark" asp-area="" asp-page="/Now">Now</a>
</li>
<li class="nav-item"> <li class="nav-item">
<a class="nav-link text-dark" asp-area="" asp-page="/Privacy">Privacy</a> <a class="nav-link text-dark" asp-area="" asp-page="/Privacy">Privacy</a>
</li> </li>

File diff suppressed because it is too large Load Diff

View File

@ -21,12 +21,15 @@
"homepage": "https://github.com/Sarsoo/Selector#readme", "homepage": "https://github.com/Sarsoo/Selector#readme",
"dependencies": { "dependencies": {
"@microsoft/signalr": "^5.0.11", "@microsoft/signalr": "^5.0.11",
"bootstrap": "^5.1.3" "bootstrap": "^5.1.3",
"vue": "^3.2.21"
}, },
"devDependencies": { "devDependencies": {
"@vue/compiler-sfc": "^3.2.21",
"clean-webpack-plugin": "^4.0.0", "clean-webpack-plugin": "^4.0.0",
"ts-loader": "^9.2.6", "ts-loader": "^9.2.6",
"typescript": "^4.4.4", "typescript": "^4.4.4",
"vue-loader": "^15.9.8",
"webpack": "^5.59.1", "webpack": "^5.59.1",
"webpack-cli": "^4.9.1", "webpack-cli": "^4.9.1",
"webpack-merge": "^5.8.0" "webpack-merge": "^5.8.0"

View File

@ -1,13 +0,0 @@
import {SecondWatcher} from "./second";
namespace Selector.Web {
class Watcher {
static example: string = "string";
static ex2: string = "awdwad";
}
}
let sec = new SecondWatcher();
console.log("hello world!");
console.log(sec);

View File

@ -1,4 +1,5 @@
import * as signalR from "@microsoft/signalr"; import * as signalR from "@microsoft/signalr";
import * as Vue from "vue";
import { FullTrack, CurrentlyPlayingDTO } from "./HubInterfaces"; import { FullTrack, CurrentlyPlayingDTO } from "./HubInterfaces";
const connection = new signalR.HubConnectionBuilder() const connection = new signalR.HubConnectionBuilder()
@ -9,9 +10,15 @@ connection.on("OnNewPlaying", (context: CurrentlyPlayingDTO) => console.log(cont
connection.start().catch(err => console.error(err)); connection.start().catch(err => console.error(err));
/// <reference path="Interface/HubInterface.ts" /> const app = Vue.createApp({
namespace Selector.Web { data() {
return {
} count: 4
}
console.log("NowPlaying!"); },
created() {
console.log(this.count);
}
});
// app.component("", TrackNowPlaying);
const vm = app.mount('#app');

View File

@ -1,5 +0,0 @@
export class SecondWatcher {
public static example: string = "string";
public static ex2: string = "awdwad";
}

View File

@ -1,6 +1,7 @@
{ {
"compileOnSave": true, "compileOnSave": true,
"compilerOptions": { "compilerOptions": {
"strict": true,
"sourceMap": true, "sourceMap": true,
"noImplicitAny": true, "noImplicitAny": true,
"noEmitOnError": true, "noEmitOnError": true,
@ -8,7 +9,14 @@
"target": "es5", "target": "es5",
"allowJs": true, "allowJs": true,
"moduleResolution": "node", "moduleResolution": "node",
"outDir": "./wwwroot/js" "outDir": "./wwwroot/js",
"baseUrl": ".",
"rootDir": "./scripts",
"paths": {
"@/*": [
"./scripts/*"
]
}
}, },
"include": [ "include": [
"scripts/**/*" "scripts/**/*"

View File

@ -3,7 +3,6 @@ const { CleanWebpackPlugin } = require('clean-webpack-plugin');
module.exports = { module.exports = {
entry: { entry: {
index: './scripts/index.ts',
now: './scripts/now.ts', now: './scripts/now.ts',
}, },
module: { module: {
@ -11,14 +10,26 @@ module.exports = {
{ {
test: /\.tsx?$/, test: /\.tsx?$/,
loader: 'ts-loader', loader: 'ts-loader',
options: {
appendTsSuffixTo: [/\.vue$/],
},
exclude: /node_modules/, exclude: /node_modules/,
},
{
test: /\.vue$/,
loader: 'vue-loader',
} }
] ]
}, },
plugins: [ plugins: [
new CleanWebpackPlugin() new CleanWebpackPlugin()
], ],
resolve: { extensions: ["*", ".js", ".jsx", ".ts", ".tsx"] }, resolve: {
extensions: ["*", ".js", ".jsx", ".ts", ".tsx", ".vue"] ,
alias: {
vue: "vue/dist/vue.esm-bundler.js"
}
},
output: { output: {
filename: '[name].bundle.js', filename: '[name].bundle.js',
path: path.resolve(__dirname, 'wwwroot/js') path: path.resolve(__dirname, 'wwwroot/js')