如何使用typescript/vue router/vuex/但不使用vue cli创建vue.js3应用程序
我的任务是创建一个支持typescript的vue3应用程序,我还必须使用vuex进行状态管理,使用vue路由器进行基本路由。但我无法在此项目中使用vue cli 我当前的代码:如何使用typescript/vue router/vuex/但不使用vue cli创建vue.js3应用程序,typescript,vue.js,vuex,vue-router,Typescript,Vue.js,Vuex,Vue Router,我的任务是创建一个支持typescript的vue3应用程序,我还必须使用vuex进行状态管理,使用vue路由器进行基本路由。但我无法在此项目中使用vue cli 我当前的代码: 因为我从未在vue项目中使用过typescript 您能向我推荐一些博客、教程,其中有人使用这些工具从头开始构建vue3应用程序,但没有vue cli吗? 全速行驶: 在VueJS 3.0框架上使用TypeScript编写登录表单。您还应该使用Vuex(状态管理)存储数据并对其进行操作,例如从服务器记录、读取和检索
因为我从未在vue项目中使用过typescript您能向我推荐一些博客、教程,其中有人使用这些工具从头开始构建vue3应用程序,但没有vue cli吗? 全速行驶: 在VueJS 3.0框架上使用TypeScript编写登录表单。您还应该使用Vuex(状态管理)存储数据并对其进行操作,例如从服务器记录、读取和检索数据。@项目中不应使用Vue/cli。你必须自己运行项目中的网页包 这对我来说非常重要
提前感谢如果无法使用Vue CLI,则必须手动安装依赖项 为了简单起见,您可以使用packet作为绑定器 这样,您就不必处理配置网页包的问题 首先确保Typescript是全局安装的 接下来,按照以下方式配置您的包.json:
{
"name": "project name",
"version": "1.0.0",
"description": "",
"main": "index.js",
"keywords": [],
"author": "",
"license": "ISC",
"scripts": {
"clean": "rm dist/bundle.js",
"start": "parcel src/index.html",
"build-prod": "parcel build src/index.html"
},
"dependencies": {
"vue@next": "^2.6.12",
"vuex": "2.0.0",
"vue-router": "2.0.0"
},
"devDependencies": {
"parcel-bundler": "^1.12.5"
}
}
这包括Vue3、Vuex、Vue路由器和Parcel的依赖项,以及Parcel的一些设置脚本
执行warn install
或npm install
安装所有依赖项
接下来,确保在rootsrc/
目录中有一个App.vue、index.html和一个index.ts
最后,在根目录下创建以下文件:
vue.shim.d.ts
declare module "*.vue" {
import Vue from 'vue'
export default Vue
}
tsconfig.json
{
"compilerOptions": {
"outDir": "./dist/",
"sourceMap": true,
"strict": true,
"noImplicitReturns": true,
"noImplicitAny": true,
"module": "es6",
"moduleResolution": "node",
"target": "es5",
"allowJs": true,
},
"include": [
"./src/**/*"
]
}
看看这个很棒的网站:
它允许您在不使用Vue CLI的情况下配置生成并实现所需的功能
你可以生成一个带有VUE和类型化脚本的项目,下载,然后按需要添加VUE路由器和Vuex。
这对我来说非常重要——考虑解释你的推理。我认为他是用CDN方法。也许他正在通过逐块迁移站点的一部分来逐步实现。然后,一旦有足够的代码库来证明花费在上面的时间是合理的,那么将整个内容移动到Vue CLI项目@EstusFlaskVue CLI只会使设置新站点变得更容易。这与Vue在幕后的工作方式无关。这只意味着你需要自己设置文件夹结构、package.json和其他东西。听起来像是家庭作业?这样一个清晰明确的任务就是这样的。也许这是不使用Vue CLI的要求?如果是因为我不知道现实世界中有多少人在开始一个项目时不使用某种形式的脚手架,那么这项工作就相当差劲@BryceHowitson@Jordan我同意这两个观点,只是指出,没有cli,Vue的工作方式没有任何不同。而且我99%确信有一些安装指南没有使用CLI。感觉谷歌搜索一下就能解决这个问题……这是一项新的工作任务。他们严格禁止我使用vue cli,我不知道如何创建/导入和使用组件、vue路由器和其他提到的组件tools@Henry查找npm和您想要的软件包。更新了我的答案@Henry@BryceHowitson我错过了你能想到的东西吗?嗯!无效的包名“vue@next“:名称只能包含URL友好字符