zoukankan      html  css  js  c++  java
  • vue cli3.0 创建项目以及配置

    1. 检查本地有没有安装 vue -V(大写)  安装则展示

     

    2. 没有则安装 npm install -g @vue/cli

    3.创建项目  vue  create  vue-admin(项目名)

       

     选择手动

     

        dart-sass和node-sass 区别

      

       详见 https://panjiachen.github.io/vue-element-admin-site/zh/guide/advanced/sass.html#%E5%8D%87%E7%BA%A7%E6%96%B9%E6%A1%88

     我选择美观

     

    1. 配置@符号

    项目根目录下添加vue.config.js

    const path = require('path');
    function resolve(dir) {
        return path.join(__dirname, dir)
    }
    module.exports = {
        // 基本路径
        baseUrl: '/',
        // 输出文件目录
        outputDir: 'dist',
        // eslint-loader 是否在保存的时候检查
        lintOnSave: true,
        // use the full build with in-browser compiler?
        // https://vuejs.org/v2/guide/installation.html#Runtime-Compiler-vs-Runtime-only
        compiler: false,
        // webpack配置
        // see https://github.com/vuejs/vue-cli/blob/dev/docs/webpack.md
        // @符号可修改如换成 $
        chainWebpack: (config) => {
            config.resolve.alias
                .set('@', resolve('src'))
        },
        // 生产环境是否生成 sourceMap 文件
        productionSourceMap: true,
        // css相关配置
        css: {
            // 是否使用css分离插件 ExtractTextPlugin
            extract: true,
            // 开启 CSS source maps?
            sourceMap: false,
            // css预设器配置项
            loaderOptions: {},
            // 启用 CSS modules for all css / pre-processor files.
            modules: false
        },
    }

  • 相关阅读:
    webpack-dev-server的使用及说明
    Web框架
    HTTP协议
    jQuery的使用
    发红包
    python操作mysql
    mysql索引与补充
    JavaScript之BOM操作
    JavaScript之DOM操作
    JavaScript之基础语法
  • 原文地址:https://www.cnblogs.com/zhaozhenzhen/p/10818667.html
Copyright © 2011-2022 走看看