【VTK】vtk例子-webpack问题

1、下载vtkjs-examples-master

https://github.com/KitwareMedical/vtk.js-examples

2、package.json配置修改

复制代码
{
  "name": "vtkjs-example",
  "version": "1.0.0",
  "description": "",
  "main": "src/index.js",
  "scripts": {
    "build-webpack": "webpack --progress --colors --mode development",
    "start": "webpack-dev-server --port 33333 --content-base ./dist",
    

    "build": "webpack-dev-server --mode=production --progress  --port 33333",

    "dev": "webpack-dev-server --mode=development  --port 33333",
    
    "dev:cone": "set EXAMPLE=cone.js & webpack-dev-server --mode=development  --port 33333",
    "dev:cone-filter": "set EXAMPLE=cone-filter.js & webpack-dev-server --mode=development  --port 33333",
    "dev:volume": "set EXAMPLE=volume.js & webpack-dev-server --mode=development  --port 33333 --",
    "dev:volume-transfer": "set EXAMPLE=volume-transfer.js & webpack-dev-server --mode=development  --port 33333",
    "dev:image-slicing": "set EXAMPLE=image-slicing.js & webpack-dev-server --mode=development  --port 33333",
    "dev:widgets": "set EXAMPLE=widgets.js & webpack-dev-server --mode=development  --port 33333"
  },
  "author": "",
  "license": "BSD-3-Clause",
  "dependencies": {
    "vtk.js": "^13.10.0"
  },
  "devDependencies": {
    "kw-web-suite": "^9.0.0",
    "webpack": "^4.41.6"
  }
}
复制代码

 

3、webpack.config.js配置修改

复制代码
const path = require('path');

// console.log(path)

const vtkRules = require('vtk.js/Utilities/config/dependency.js').webpack.core.rules;

console.log(process.env['EXAMPLE'])
// const example = process.env['EXAMPLE'].replace(/[\/]|\.\./g, '') || 'cone.js';
// const example = process.env['EXAMPLE'] && process.env['EXAMPLE'].replace('') //|| 'cone.js';
const example = process.env['EXAMPLE'] || 'cone.js';
console.log(example)
// example = "volume"

var entry = path.join(__dirname, 'src', example)
console.log(entry)
var entry2 = './src/'+ example
entry2 = entry2.trim()
console.log(entry2)

module.exports = {
  entry: entry.trim(),
  output: {
    path: path.join(__dirname, 'dist'),
    filename: 'app.js',
  },
  module: {
    rules: [{
      test: /\.js$/,
      loader: 'babel-loader',
      exclude: /node_modules/,
    }, ].concat(vtkRules),
  },
  resolve: {
    extensions: ['.js'],
  },
  devServer: {
    contentBase: path.join(__dirname, 'dist'),
    disableHostCheck: true,
    hot: false,
    quiet: false,
    noInfo: false,
    stats: {
      colors: true,
    },
  },
};

// console.log(module.exports)
复制代码

4、运行测试

npm run dev

npm run dev:cone

 

posted @   咸鱼翻身  阅读(533)  评论(0编辑  收藏  举报
编辑推荐:
· Linux系列:如何用 C#调用 C方法造成内存泄露
· AI与.NET技术实操系列(二):开始使用ML.NET
· 记一次.NET内存居高不下排查解决与启示
· 探究高空视频全景AR技术的实现原理
· 理解Rust引用及其生命周期标识(上)
阅读排行:
· 物流快递公司核心技术能力-地址解析分单基础技术分享
· .NET 10首个预览版发布:重大改进与新特性概览!
· 单线程的Redis速度为什么快?
· 展开说说关于C#中ORM框架的用法!
· Pantheons:用 TypeScript 打造主流大模型对话的一站式集成库
历史上的今天:
2016-02-28 端口占用处理(Windows)
点击右上角即可分享
微信分享提示