路径、模块的设置在/..js中的配置

可不可以自动化加载,不需要每次都手动引用呢?自带的插件配置解决了这个问题。这样模块在使用时会自动加载,在///.但是要注意:在上面设置模块别名的时候,已经设置了vue的别名,为什么模板自动设置了别名呢?所以,如果我们不做模块自动化加载,vue模块的别名可以使用vue.最后的最后,曾尝试用的语法写配置文件,但是并没有找好较好的实践方案,如果你有好的实践方案请推荐一下,谢谢!

路径、模块别名设置

在/.base.conf.js中可以看到如下配置:

  ......  resolve: {    extensions: ['.js', '.vue', '.json'],    alias: {      'vue$': 'vue/dist/vue.esm.js',      '@': resolve('src'),    }  }  ......

所涉及的配置可以查看官方相关API,即设置自动解析扩展,设置路径或模块的别名

在///.js中有对应的用法:

p>

import Hello from '@/components/Hello'

同样,我们可以进一步设置一些路径别名:

    alias: {      'vue$': 'vue/dist/vue.esm.js',      '@': resolve('src'),      'components': '@/components',      'pages': '@/pages',      'js': '@/modules/js',      'css': '@/modules/css',      'sass': '@/modules/sass',      'imgs': '@/modules/imgs'    }

In ///.js中对.vue的引用可以简写为:

import Hello from 'components/Hello'

模块自动化配置

在 ///.js 中,vue 和 vue- 都需要先加载

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

是否可以自动加载而无需每次都手动引用?内置插件配置解决了这个问题。

在/.base.conf.js中添加如下配置:

var webpack = require('webpack')module.exports = {  entry: utils.entries(),  output: {...},  plugins: [    new webpack.ProvidePlugin({      Vue: 'vue',      Resource: 'vue-resource',      Router: 'vue-router',      Vuex: 'vuex'    })  ],  resolve: {...}  ......}

这个模块在使用的时候会自动加载,在//.js中可以省略vue和vue-的引入:

//import Vue from 'vue'//import Router from 'vue-router'Vue.use(Router)

但是注意:上面设置模块别名的时候,已经设置了vue的别名,为什么模板会自动设置别名呢?还记得我们在构建基础设施的 Vue 步骤中选择的 + 吗? Vue的npm包默认导出 ,所以设置这个别名的时候可以看Vue官方文档的描述。

默认vue模块的配置,使用模块化脚本,但本质上是一个基于node的工具,node目前不支持原生模块化

'vue$': 'vue/dist/vue.esm.js'

我们对比一下mon.js和vue.esm.js,你会发现有两个不同:一个是严格模式,一个是模块化:

所以,如果我们不做自动模块加载。 vue 模块的别名可以使用 vue.esm.js,使用时会翻译,但如果使用 .要进行自动模块加载,您需要将别名更改为:

 resolve: {    extensions: ['.js', '.vue', '.json'],    alias: {      'vue$': 'vue/dist/vue.common.js',      '@': resolve('src'),    }  }

最后,关于节点对的支持,可以查看,不包括对/的支持

最后尝试使用语法编写配置文件,但没有找到好的实践方案。如果你有好的练习计划,请推荐,谢谢!

本系列文章:

基础设施搭建插件和css预编译配置路径别名和模块自动加载配置rap自动切换配置自动部署移动端适配方案UI库选择和使用移动调试和异常监控

免责声明:本文来自网络用户投稿,不代表本站观点和立场。如有侵权请发送邮件至tzanseo@163.com告知本站删除,本站不负任何责任及承诺。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。

发表评论

登录后才能评论