首先，确保你的系统上安装了 Node.js 和 npm。你可以通过在终端或命令提示符中运行以下命令来检查它们是否已安装：

node -v npm -v

如果未安装，请从 Node.js 官网 下载并安装。

安装 Nest CLI

Nest CLI 是一个命令行工具，用于快速创建和管理 NestJS 项目。安装完成后，你可以使用它来生成项目、服务和控制器等。

npm i -g @nestjs/cli

创建一个新的 Nest 项目
使用 Nest CLI 创建一个新的项目：

nest new project-name

将 project-name 替换为你的项目名称。这将创建一个新的目录，并在其中生成一个基本的 NestJS 项目结构。

启动开发服务器
进入项目目录并启动开发服务器：

cd project-name npm run start

现在，你可以在浏览器中访问 http://localhost:3000，你应该会看到一个欢迎页面。

创建控制器
使用 Nest CLI 生成一个新的控制器：

nest g controller users

这个命令将创建一个名为 users 的控制器，并生成相应的路由和控制器逻辑。

创建服务

使用 Nest CLI 生成一个新的服务：

nest g service users

这个命令将创建一个名为 users 的服务，并生成相应的服务逻辑。

• 安装

  • npm install vue-router

• 简单操作使用

  1 2 3 4

  import Vue from 'vue' import VueRouter from 'vue-router' Vue.use(VueRouter)

• vue-router操作使用分解

  1 2 3 4 5 6 7 8 9 10

  <div id="app"> <h1>Hello App!</h1> <p> <!-- 使用 router-link 组件来导航，通过传入 `to` 属性指定链接，<router-link> 默认会被渲染成一个 `<a>` 标签 --> <router-link to="/foo">Go to Foo</router-link> <router-link to="/bar">Go to Bar</router-link> </p> <!-- 路由出口，路由匹配到的组件将渲染在这里 --> <router-view></router-view> </div>

• 定义路由 每个路由即为一个组件

  1 2 3 4

  const routes = [ { path: '/foo', component: Foo }, { path: '/bar', component: Bar } ]

• 创建router实例

  1 2 3

  const router = new VueRouter({ routes // （缩写）相当于 routes: routes })

• 创建和挂载根实例

  1 2 3 4

  const app = new Vue({ 　　el:'#app', 　　router })

• vue-router默认是hash模式,url:http://localhost:8000/#/hello
  如果想取消掉#,可以使用history模式，这样可以利用 history.pushState API完成url跳转无需重新加载页面

  1 2 3 4

  const router = new VueRouter({ mode: 'history', routes: [...] })

  那么url::http://localhost:8000/hello
  如果使用history模式,服务器端需要进行一些配置才可以,否则直接访问带参数的路由地址会返回404

• 一些服务器端的配置

• apache 需要修改配置
  在项目目录下新建.htaccess文件(跟index.html同级)

  1 2 3 4 5 6 7 8

  <IfModule mod_rewrite.c> RewriteEngine On RewriteBase /ibms/ RewriteRule ^index\.html$ - [L] RewriteCond %{REQUEST_FILENAME} !-f RewriteCond %{REQUEST_FILENAME} !-d RewriteRule . /ibms/index.html [L] </IfModule>

  记得重启apache服务器

• nginx

  1 2 3

  location / { try_files $uri $uri/ /index.html; }

• IIS服务器配置 注意:IIS需要安装重写工具

  1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18

  <?xml version="1.0" encoding="UTF-8"?> <configuration> <system.webServer> <rewrite> <rules> <rule name="ReactRouter" patternSyntax="ECMAScript" stopProcessing="true"> <match url=".*" /> <conditions> <add input="{HTTP_METHOD}" pattern="^GET$" /> <add input="{HTTP_ACCEPT}" pattern="^text/html" /> <add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" /> </conditions> <action type="Rewrite" url="/index.html" /> </rule> </rules> </rewrite> </system.webServer> </configuration>

为了防止404报错信息,可以在路由中配置    
1
2
3
4
5
6
const router = new VueRouter({
    mode: 'history',
    routes: [
        { path: '*', component: NotFoundComponent }
    ]
})

• 重定向和别名

  • 重定向通过 routes 配置来完成，下面例子是从 /a 重定向到 /b

  1 2 3 4 5

  const router = new VueRouter({ routes: [ { path: '/a', redirect: '/b' } ] })

  重定向的目标也可以是一个命名的路由：
  

  1 2 3 4 5

  const router = new VueRouter({ routes: [ { path: '/a', redirect: { name: 'foo' }} ] })