vue-cli 2.x版本中conf/index中assetsRoot、assetsSubDirectory、assetsPublicPath路径的含义

vue-cli 2.x版本中conf/index中assetsRoot、assetsSubDirectory、assetsPublicPath路径的含义

    assetsRoot: path.resolve(__dirname, '../dist'),  
    assetsSubDirectory: 'static',
    assetsPublicPath: '/',

• assetsRoot 资源根路径 项目打包后存放的路径 即项目目录下的dist文件
• assetsSubDirectory 资源子目录 存放静态资源文件的static，css、js、img
• assetsPublicPath 资源公共路径 ，我们访问静态资源需要额外的前缀
  例如 ：
• assetsPublicPath：’./’
  在代码中我们引用资源路径

<img src="../../img/1.jpg">

打包之后的文件路径为 :static/img/1.jpg

另外vue/cli使用的是publicPath配置的资源前缀的

PS. vue-cli2.x的与vue/cli3.x的版本打包有所不同的
在vue-cli2.x中我们在css中引如图片路径打包的时候css中引入的资源是static/img (不知道有没有人碰到过)，这肯定是不对的，.css文件时在dist/static/css文件夹下的，css肯定访问不到那样的资源，因为请求的路径是’xxxx/static/css/static/img/xxxx’，除非是打包的时候是assetsPublicPath:’/‘且是放在网站的根路径下的（我nginx配置再加上’…/…/‘去解决的，至少css文件的资源拼接对了，而其他的文件也确实是在根路径下的所有…/…/依旧是根）
vue/cli3.x 打包就没有怎么多问题，只要是css引入资源直接统统’…/img/’，当然也可以配置，需要自己去研究了

有些人是用的其他方法解决的 ，虽然我没有用成功，但还是记录下
webpack.base.conf.js

            {
                test:/\.css$/,
                use: [
                    {
                        loader:MiniCssExtractPlugin.loader,
                        options:{
                            publicPath: '../'
                        }
                    },
                    "css-loader"
                ]
            },

assetsRoot:打包后存放的位置
assetsSubDirectory：静态文件路径会拼接上 assetsPublicPath+assetsSubDirectory
assetsPublicPath：‘test’ ---- 访问路径后添加/test