使用webpack配置項目中的常量以及替換文件內容

#一、替換html中內容。好比替換js的cdn。 ##webpack的配置css

const cdn = '//cdn.bootcss.com';
new ReplacePlugin({
      entry: './src/assignment-instructor.html',
      //hash: '[hash]',
      output: `${psweb_path}/assignment-instructor.html`,
      data: {react: `<script src="${cdn}/react/0.14.7/react.min.js"></script>`}
    }),

##html頁面寫法html

<!-- replace:react -->
  <script src="../js/react.min.js"></script>
  <!-- endreplace -->

詳細可參考 replace-webpack-pluginreact

#二、JS中常量的替換webpack

webpack的配置 在plugins中加入

new webpack.DefinePlugin({
            'process.env.NODE_ENV': '"development"',
            'process.env.webSocket': '"192.168.0.193"'
        }),

##js中使用:git

export const webSocketUrl = `ws://${process.env.webSocket}/notice/websocket`;

在js 使用{}將在webpack中定義的變量引入便可。 詳細可參考webpack DefinePlugingithub

相關文章
相關標籤/搜索