JS视频课程学习（二）

七、nrm

八、webpack

    webpack的基本使用

//main.js是项目的JS入口文件

// 导入 Jquery
// import *** from *** 是ES6中导入模块的方式
// ES6的代码太高级了，浏览器无法解析，这一行会报错
import $ from 'jquery'
// const $ = require('jquery')


$(function() {
    $('li:odd').css('backgroundColor', 'lightblue')
    $('li:even').css('backgroundColor', function() {
        return '#' + 'D97634'
    })

})


//webpack可以做的事情：
// 1. webpack能够处理js文件的相互依赖关系
// 2. webpack能够处理js的兼容问题，把高级的、浏览器不支持的语法，转化为低级的浏览器能正确识别的语法
// webpack 要打包的文件路径 打包好的输出文件的路径

    webpack基本的配置文件

    使用webpack-dev-sever工具实现自动打包编译功能

    需要更改引入路径： 

    webpack-dev-sever的常用命令参数

    html-webpack-plugin中的两个操作

    loader--配置处理css样式表的第三方loader

    webpack中url-loader的使用

    webpack中使用url-loader处理字体文件

    关于webpack和npm中的几点问题

        json文件中不能写注释，“不是内部也不是外部命令”一般有两种情况，一是没有安装，二是环境变量

    webpack中的babel配置

    使用vue实例的render方法渲染组件

    在webpack构建的项目中，使用vue开发

    或者

    在vue中结合render函数渲染指定的组件到容器中

//函数简写为：
render: c => c(login)

    总结，在webpack中使用vue

    export  default和export的使用方式

    结合webpack使用vue-router

    结合webpack使用children子路由

    组件中style标签lang属性和scoped属性

    抽离路由模块