笔记三十六:使用vite构建项目

127 阅读1分钟

本文已参与「新人创作礼」活动,一起开启掘金创作之路。

本文已参与「新人创作礼」活动,一起开启掘金创作之路。

链接: www.jspang.com/detailed?id…. 创建vue3

// 创建3.0 步骤
npm init vite-app <project-name>
cd <project-name>
npm install
npm run dev

// 创建3.2步骤
npm init vite@latest

创建react

npm init vite-app --template react
npm install

安装sass

npm i -D sass

安装路由和vuex

npm i vue-router@next vuex@next -S

vite+vue3配置文件 创建vite.config.js文件

const path = require('path')
export default function () {
    return {
        // 项目启动的根路径
        // root:  'G:\\work\\myself\\studyNode\\nodeMysql\\client',
        // 入口
        entry: 'index.html',
        // 出口
        outDir: './../public',
        // 打包后的跟路径
        base:'./',
        // 输出的静态资源的文件夹名称
        assetsDir:'assets',
        // 是否开启ssr服务断渲染
        ssr: false,
        // 重命名路径  path.resolve(__dirname, './src')
        alias : {
            '/@/':  path.resolve(__dirname, './src')
        },
        // 端口
        port: 3002,
        // 是否自动开启浏览器
        open: true,
        // 开启控制台输出日志
        silent: false,
        // 哪个第三方的包需要重新编译
        optimizeDeps:[],
        // 代理,最重要,其他的都可以有默认配置
        proxy: {
            '/api': {
                target: 'http://localhost:3000',
                changeOrigin: true,
            }
        },

    }
}